CSS Box Model margin border padding content 23
CSS Box Model margin border padding content 23
Box Model Properties Property Valid values Example border-width thin, medium, thick, number border-width: thick; border-width: 10 px; border-style dotted, dashed, solid, double, groove, ridge, inset, outset, none border-style: solid; border-color name, rgb value, or hex code border-color: red; Can set sides individually for all of the above using border-left-, border-right-, border-top-, and border-bottom-. Examples: border-top-width: 5 px; border-left-style: dashed; border composite rule: set width, style, color, in that order. border: 10 px solid red; padding, margin number expressed in pixels (px), width of letter M in font (em), or % of parent block. Can set sides individually too! margin: 10 px; padding: 5 em; margin-right: 30%; padding-top: 10 em; 24
Layout Properties Property Valid values Example position relative (to normal flow position) absolute (out of normal flow) position: absolute; top, bottom, left, right number expressed in pixels (px), width of letter M in font (em), or % of parent block top: 5 px; height, width same as above height: 20 em; z-index an integer bigger number = more foreground z-index: 2; float left, right float: left; display block, inline, none display: inline; 25
- Slides: 3