newbie
newbie

Reputation: 14950

IE7 CSS for IE7

I am trying to design my disabled select box in IE7.

<div id="wwctrl_pay" class="wwctrl styled-select">
     <select id="payment"><option>...</option></select>
</div>

How can I change the CSS of #wwctrl_pay if the select box is disabled? Can I do it using CSS?

Upvotes: 0

Views: 204

Answers (2)

Chamika Sandamal
Chamika Sandamal

Reputation: 24312

Best option is when you disable the select box, Add a new class and add your style within that class.

Upvotes: 2

biziclop
biziclop

Reputation: 14596

If you don't mind some extra markup, and other limitations:

http://jsfiddle.net/s6LbB/1/

<div id="wwctrl_pay" class="wwctrl styled-select">
     <select id="payment" disabled="disabled"></select>
     <div></div>
</div>

CSS:

.wwctrl {
    position: relative;
    border: 1px solid blue;
}

select[disabled] + div {
    position: absolute;
    z-index: -1;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: yellow;
}
​

Alternatively, if this is for IE7 only, you could try using IE's proprietary css expressions feature.

Upvotes: 2

Related Questions