Difference in column widths in IE and Firefox

Google ‘IE padding’ and you’ll get a lot of hits that explain the issue and how to fix it.

Thanks wendel.

I have not been able to find a fix that works for this. The most commonly suggested solution is the dsiplay:inline property applied after the MARGIN: property under .narrowcolumn, but when I apply this, it pushes my sidebar all the way to to the bottom of the page.

I’m no expert at CSS, so I usually have to muck around with it until I find a combination that works. Save a copy of your stylesheet, then try various combinations of float on those divs. I’ve had luck floating the first column left, no float on the second, and float the third column right. The second column will sometimes just slip into place. It depends on the order they are being called into the template.

Plus you might have too much total width for all three columns to fit in the wrapper that contains them all. If your page is 950 pixels wide (for example) the total of the widths of the three columns, plus their padding, borders, and margins has to be less.

If you save a backup, you really can’t break anything by trying.

HTH

Go to this link to find out why this is happening.
Just do a search for your problem, it is a very good resource for compatibility problems. Yes it is in your css file:

https://www.alistapart.com/

Also you can download Firebug for Firefox… muck around with the css directly in your browser without changing any code to see what changes before making any changes in your actual css file.

Thanks, it’s almost impossible to find anything related to my specific issue on that site you provided, martart. My best bet is to continue googling “IE padding”.

Here’s my work around. Maybe it will help someone.

I learned IE subtracts padding and margin from its calculation of the content size, whereas firefox only uses content “width” value, without regard to padding and margin. So, in theory, having no padding and no margins would cause both browsers to display the content the same — of course, having no margin and padding would just be lame.

So, I had to settle with minimizing margins and padding as much as I could stand to do so, bringing the appearance in both browsers together as close as possible.

Hey maybe I should be an admin here.

https://amadimag.com/blogosphere