Difference between revisions of "CSS"
m ({{glossary}}) |
|||
| Line 1: | Line 1: | ||
| + | {{glossary}} | ||
'''C'''ASCADING '''S'''TYLE '''S'''HEETS. A web technology to separate [[content]] from [[presentation]] | '''C'''ASCADING '''S'''TYLE '''S'''HEETS. A web technology to separate [[content]] from [[presentation]] | ||
| Line 20: | Line 21: | ||
*[[Templates]] | *[[Templates]] | ||
*[[wikipedia:Cascading Style Sheets]] | *[[wikipedia:Cascading Style Sheets]] | ||
| − | [[Category:CSS | + | [[Category:CSS]] |
Revision as of 23:41, 27 September 2010
|
CASCADING STYLE SHEETS. A web technology to separate content from presentation
Control over minimum & maximum width
In CSS2 the min-width and max-width properties can be used to impose constraints onto an elements width. This is very useful for allowing a site's content area to float in the middle of the page between a pair of margins, but if the clients browser window is too narrow, the content area will not shrink beyond a certain size and instead the margins will shrink. Conversely if the clients window is extremely large, it may not be desirable in terms of the sites layout for the content area to grow beyond a certain width, and instead the margins should grow instead.
Unfortunately IE does not support the min-width and max-width properties, but an IE-only CSS method called expression can be used to create the same effect. Here's an example where the width of the content area is set to 75% of the total page width, but is not allowed to be less than 600 pixels wide, or more than 900 pixels. <css> width: 75%; max-width: 900px; min-width: 600px; width: expression(document.body.clientWidth > 1200 ? "900px" : document.body.clientWidth < 800 ? "600px" : "75%" ); </css> The final line is the IE hack which achieves the same result as the first three lines, but is ignored by non-IE browsers.
