Why would you use a HTML/CSS width of 99.9% instead of 100%?

The hasLayout property

It’s a dirty hack used to set the IE specific hasLayout property of the element to true. The hasLayout property “determines how elements draw and bound their content, interact with and relate to other elements, and react on and transmit application/user events.” Giving an element layout is an easy way to fix many layout related bugs which appear in Internet Explorer.

What’s with the 99.9%?

Setting the width to 99.9% is one way to trigger it. The reason you would use 99.9% is because layout is given to an element if its width is set to anything other than auto. Setting it to a percentage prevents the need to use a fixed width.

After some testing in jsFiddle, I’ve come to the conclusion that it really isn’t necessary to to use a width of 99.9%, using a width of 100% is just as effective. http://jsfiddle.net/3qfjW/2/ (IE-Only). It seems that setting width to 99.9% may have been a common misconception which stuck.. Spread the word people.

Other methods

You can also trigger hasLayout using zoom: 1; While this is the preferred method for many, as it doesn’t mess with other style related features of an element, it is also invalid CSS code, which is not an option to use for some developers.


Further Reading

For more methods to trigger hasLayout check out: http://www.satzansatz.de/cssd/onhavinglayout.html

For more information on the hasLayout property check out the MSDN article on hasLayout http://msdn.microsoft.com/en-us/library/bb250481(VS.85).aspx (This is actually a great read, lots of detailed information)

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)