I’m still in the middle of my big CSS Reboot redesign/rebuild and last night I hit a surprising problem. After listening to the WE05 Podcasts I decided to opt for a liquid layout but found that certain browser widths were giving me a 1px variance in Firefox. Apparently it’s a rounding error in Gecko (not IE for once) and it annoys me something chronic.
What I’ve done is used JavaScript to find the width of the page and base my container div’s width on a percentage of that. Because I round (well round down because I just parse to an integer) there’s no decimal for a rounding error so everything is fine. The method does have a slight resize lag so I’ve made it so the function will only run on Gecko powered browsers. Hopefully the Mozilla team fix this bug soon. Please don’t laugh at my dirty JavaScript (however improvement tips are welcome). See the JavaScript
I have since decided to stay with a fixed width layout as there are still minor bugs with the JavaScript method. Also I don’t think that I currently have enough content to justify a liquid layout. I have however uploaded an updated version of the script for those who are interested.