PDA

View Full Version : IE rendering excessive padding without CSS


johnMoss
09-23-2011, 03:03 PM
Or so I believe...
www.johnmossdesigns.com (http://www.johnmossdesigns.com)

Down at the bottom of the page are a series of links divided up in 3 columns.
You will see them with blue arrowheads. Normal rendering is such that they all list as nice single line entries.

When browser testing locally from my computer everything renders fine, IE & all...

When uploaded to the server, they render correctly in Firefox, but not IE. Testing in IE one can see that these <li> values are being pushed too far to the right, resulting in characters being pushed to the next line. Do I need to hack this out or is something inherently wrong with the CSS?
Box widths for the containing divs (col) are set to 160 px, and padded left at 15 px.

gentleone
09-23-2011, 06:43 PM
Which IE version, John? I had a look in IE 8 and didn't notice what you refer. The only thing I've noticed is that when I hover Dreamweaver Club link, the hover change to bold font pushes the third column to the right. Probably a box modal issue.

Another thing... that background image is hugh, you night want to optimize it a bit more. It takes quite a while until it shows up.

johnMoss
09-23-2011, 06:46 PM
It may have changed on you several times... I'm playing with it right this sec, & have uploaded 10 versions of css in the last 10 mins... In the moment I want to at least have the lines display properly, so creating new css rules...

johnMoss
09-23-2011, 06:56 PM
Ok at this point I'll stop for a bit. Take a look the links again. IE vs. Firefox. I'm using IE 9.

Look at the blue arrows in relation to the headers. The arrows serve as a background image to the links, so that is the clue that IE is rendering these links with padding. Tis a mystery....

johnMoss
09-23-2011, 06:58 PM
The delay is more likely due to all the excess crap I've loaded to work through trying to use html 5. Once I start zeroing in on the final design I'll do some serious house-cleaning :)

johnMoss
09-23-2011, 07:25 PM
oops... stand corrected on the background... I dropped it down to 198K from 598...

edbr
09-24-2011, 02:07 AM
looks the same to me ff 6 and IE9

johnMoss
09-24-2011, 01:32 PM
In the I extended the widths of the 2 left containers & now they render the same. Odd that prior to this, one worked & one didn't. There simply wasn't any css rule pushing a left pad. Fixed now though...