CODEWITHSUNDEEP
cssinternet-explorer-7
Oleg Tarasenko
Oleg Tarasenko

Reputation: 9610

CSS: help neded for IE7

For some reason http://funnyfurniture.net/ and http://funnyfurniture.net/p/5/teak-root-garden-chair/ are so badly broken in IE7. Can somebody suggest a fix?

Upvotes: 0

Views: 114

Answers (2)

thirtydot
thirtydot

Reputation: 228152

It's because you're using display: inline-block on .content li.shadow-pod.

IE7 only supports display: inline-block on elements that are naturally inline (such as <span>), unless you hack it into shape. Use this:

.content li.shadow-pod {
    /* your other rules */

    display: inline-block;
    *display: inline;
    zoom: 1
}

That's using the Star Property Hack to tell only <IE7 to apply the display: inline rule.

It is invalid CSS, but it does no harm. It's fine to break validation provided that you understand what you're doing. That said, you could always use a valid hack or a conditional comment instead:

<!--[if lt IE 8]>
<style>
.content li.shadow-pod {
    display: inline;
    zoom: 1
}
</style>
<![endif]-->

Also, see this previous answer I wrote: How to give Internet Explorer different CSS lines?

Upvotes: 2

Galen
Galen

Reputation: 30170

you're using

.content li.shadow-pod {
    display: inline-block;
}

inline-block isn't fully supported in ie7

try float:left instead

Upvotes: 0

Related Questions