IE7 CSS Issues

[lprintz]

Hello all!

I’m having a heck of a time dealing with IE7 issues on a website I’m working on.

If you look at top right of the header of http://www.americasjobexchange.com in IE7, you’ll see the phone number pushing the banner down.

I have a conditional IE7 stylesheet I’m playing with but, for the life of me, I can’t seem to solve this. Do I need to break this out of a list to get it to play nice?

Len

[Senff]

You’re using some CSS that IE7 has trouble with.

For example, *:first-child+html #aje-video-job is understood by modern browsers (and ignored, because it’s a declaration that is very specific and doesn’t occur anywhere in the document), but IE7 does apply it to #aje-video-job and that’s why that element is 600px wide.

It’s used in a lot of other places, so I would suggest to get rid of all those anyway, since they don’t have value for modern browsers, and screw up older browsers.

[lprintz]

Thanks Senff…that definitely explains the issue with the callouts at the bottom.

But actually, I was concerned with the phone number and banner at the top. I tried messing with the widths of the <p>s, negative margins (yuck) but to no avail :(

[Senff]

I actually don’t see anything wrong in IE7 with the phone number and the banner. It all looks good for me…

On another note: you entered content in your latest post that screws up the layout of this page. Please don’t edit/fix it, so Chris can look into this bug.

[lprintz]

I’m so sorry…it’s on the EMPLOYER side!

http://www.americasjobexchange.com/employer/

[Senff]

Make sure that :

• #questions-employerlink .list-item has float:left
• #questions-employerlink .call-number has a top margin of 11px
• all styles related to #questions-employerlink in ie7_new.css are removed

Can’t say for sure it’ll fix it but give it a try.

[Author]

Posts