PROWAREtech
Cascading Style Sheets: Tutorial - Page 10
Width and Height
The width is the sum of the properties of the width
, border-left
, border-right
,
margin-left
, margin-right
, padding-left
and padding-right
assuming
that all of these values were set with pixel values.
The height of elements should, generally speaking, never be set because if they are too small to fit their
content then they will overflow or, if the overflow
property is set, some of the content will be hidden. The
exception to the rule of setting height is when there is no content in the element, or when creating a menu or other element
like a fixed or absolute position
element.
The max-width property sets the maximum width for an element. The element can be less than the setting but it can not
be more. This means that it will resize to fit smaller screens but will not grow larger than the value specified. This is
means that on high resolution screens the document will not look odd. The max-height property works the same
way as does the max-width
one does except that it applies to the height.
The min-width property sets and element's minimum width. The element can be wider but never less than the
value specified. This is useful when the document would be too deformed if it becomes too narrow. The
min-height property works like the min-width
except that it applies to the height.
Floating Elements
Typically, an HTML document flows from the top down, one block-level element on top of another. However, floating elements
move to the left or right of their containing element. When needing to ignore a floated element by having an
element wanting not to wrap around the floated element, specify the clear
property.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec egestas imperdiet purus, sit amet aliquet sapien gravida quis. Curabitur sed velit eu est finibus malesuada et eu nisl. Curabitur vel sapien et massa suscipit rhoncus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Quisque commodo, libero vitae tincidunt volutpat, felis elit lacinia nibh, id vehicula tellus erat ut ex. Vivamus vehicula arcu sit amet arcu tincidunt, nec ultricies arcu suscipit. Donec tempus metus nec faucibus gravida. Vivamus eu ligula feugiat, pharetra massa ac, efficitur tellus. Quisque faucibus nisi aliquet congue condimentum. Praesent tellus lectus, vestibulum sit amet lacus ac, sagittis rutrum velit. Morbi tempus accumsan cursus. Morbi egestas nisi quis neque lobortis interdum. Sed tristique augue nec dignissim condimentum.