The width CSS property sets an element's width. By default, it sets the width of the content area, but if box-sizing is set to border-box , it sets the width of the border area.
To convert it to a fixed-width layout, simply add a fixed with to the #wrapper and set the margins to auto. Setting the margins to auto will cause the left and right margins to be equal no matter how wide the browser window is, which will cause your fixed-width layout to be positioned in the center of the browser.
Yes, as per the CSS 2.1 Specification, all non-negative values are valid for width, that includes percentage values above 100%.
\9
is a "CSS hack" specific to Internet Explorer 7, 8, & 9.
This simply means that the one specific line of CSS ending with a \9;
in place of the ;
is only valid in IE 7, 8, & 9.
In your example,
width: 500px\9;
means that a width of 500 pixels (same result as width: 500px;
) will only be applied while using IE 7, 8, & 9.
All other browsers will ignore width: 500px\9;
entirely, and therefore not apply width: 500px;
to the element at all.
If your CSS looked like this...
#myElement {
width: 300px;
width: 500px\9;
}
The result would be #myElement
500 pixels wide in IE 7, 8, & 9, while in all other browsers, #myElement
would be 300 pixels wide.
More info
EDIT:
This answer was written in 2011. It should now be noted that this hack also works in IE 10.
It's a css hack for IE9 & below version
write like this:
width: 500px\9;
Read this article http://dimox.net/personal-css-hacks-for-ie6-ie7-ie8/
In IE9 to set the width property you just add this hack.
e.g
.align {
float:left;
margin:5px;
background-color:blue;
width:65px;
width:\9 !important;
}
CSS Hack for IE9
/* Hack CSS IE9 */
.csshackie9 {color:#f00\9\0\;}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With