CODEWITHSUNDEEP
cssinternet-explorerclass
tiswas
tiswas

Reputation: 2101

Internet Explorer multiple classes

I have a link on my page which looks like:

<a href="www.wherever.com" class="tour-register id-tour-button"></a>

and my css reads:

.id-tour-button { display: inline-block; position:relative; z-index: 10; }
a.tour-register { background: transparent url(../img/register.png) no-repeat; width: 133px; height: 23px; }

This works perfectly in firefox, but in IE the link disappears, and inspection using IETester has shown that the element isn't using the second line for its styling at all. What's wrong with what I've done?

Upvotes: 1

Views: 1243

Answers (1)

Capsule
Capsule

Reputation: 6159

Multiple classes don't work in IE6 (it keeps the second class only, hence the behaviour you get). Which version do you exactly use?

EDIT: After Charles comment, I'm wrong about this and the problem probably comes from the display: inline-block not well understood (hence the width & height not applied because the anchor is treated like inline. Could you try with display: block instead? (it will probably break your design but at least you'll see what's going on)

Upvotes: 2

Related Questions