Course: CSS Basics

Non-Inherited Properties [14/15]

Not every property can be inherited. Some properties apply to a given element only and may not be inherited by its descendants.

Such non-inherited properties are: width, height, paddings and margins, positioning mode, etc. Really, how would you feel like if you set paddings for body and see all its nested elements padded as well.

For more detail on inheritance, welcome to the upcoming "Inheritance and Cascading" course.

Do it
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Non-Inherited Properties</title> </head> <body> <h1>CSS Properties</h1> <p>There is a multitude of properties in CSS. They can be classified into the following groups:</p> <ul> <li>Text formatting</li> <li>Styling sizes, paddings and margins</li> <li>Element positioning</li> <li>Page layout</li> <li>Decorative: colors, background, shadows;</li> <li>etc.</li> </ul> </body> </html>
body { } ul { }
HTML Academy
  1. For the body tag, set padding: 20px;.
  2. For ul, set border: 1px solid #cccccc;.
  3. For ul, set padding: 30px;.
Theory Check Next