Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
When setting widths of elements with CSS, I often end up wanting to set percentage widths that aren’t whole percentages.
Do all (which I doubt) browsers handle decimal percentages in the same way, or do they render differently?
Can I accurately use it for layouts?
Yes they do.
From my memory:
In Opera, you cannot set the decimal places of the percentage so, if you set 33.3% it uses only 33% (rather annoying) (edit:Opera may have improved on that in current version as it seems)
In Firefox, if you have percentages that add up to 100%, the pixels don’t always add up to the 100% of the pixels
e.g. you have a outer div with three columns all with width: 33.33333%. If the outer div has width 100px, the columns will have 33 pixels and the sum is 99 pixels and not 100.
(edit: Firefox does better than I remember. Maybe they improved)
Old IE, I cannot remember IE9 seems to work fine. The bad one of course is IE7, which rounds up (as the IE6, but who cares?). IE8/9 seem to work ok
Chrome works fine
Safari: can’t remember
edit
Her one can test for oneself
http://jsfiddle.net/fTpFw/
conclusion
After I played with my fiddle in different browsers I think they all have improved. The only bad implementations (from what I want to achieve) in modern browsers is Opera and Safari. IE7 is a stopper, too. If you don’t have to deal with these buggers, you could go ahead and use the percentage widths.