Disabled Buttons in CSS?

views:

1946

answers:

+1 Q:

Disabled Buttons in CSS?

Hi All,

I'm trying to get a button which looks exactly the same whether it is enabled or disabled, but whenever I disable the button it seems to ignore any font styles I have set. This seems to be the case in IE but not other browsers.

So does anybody know the CSS to change a disabled button so that the font is not embossed?

Thanks in advance, Chris

[Edit] The CSS is as follows:

.Button
{
    background-color:#332F27;
    border-bottom-color:#1B1B1B;
    border-top-color:#3B3B3B;
    border-left-color:#3B3B3B;
    border-right-color:#0C0C0C; 
    color:Black;
    font-style:normal;
}

The button has the attribute Class="Button" [/Edit]

+2 A:

If you are changing the disabled property of the button then you won't be able to get the feel and look of a normal button with CSS which will work in all browsers.

The easiest way is to add another button with no click event attached to it and set this button's display to inline and hide the original one.

If you still want to use CSS for this you can refer this link.

Styling disabled form controls with CSS

rahul 2009-07-01 11:30:30

Not sure I'm following your answer - my CSS works fine in Chrome, just not IE. I don't see why I can't change the look and feel of the button?

Chris 2009-07-01 11:36:06

I've looked at the link just now - thought it looked promising, but the text is still embossed.The CSS I'm using is:.Button{ background-color:#332F27; border-bottom-color:#1B1B1B; border-top-color:#3B3B3B; border-left-color:#3B3B3B; border-right-color:#0C0C0C; color:Black; font-style:normal;}The button is disabled and has Class="Button"

Chris 2009-07-01 11:44:31

Why don't you use another button?

rahul 2009-07-01 11:47:55

I'll think about using another button, but it doesn't feel like a very clean solution... Would it cause a postback if there was no click event?

Chris 2009-07-01 11:52:08

I think it might be difficult to achieve this with css. No it won't cause a postback without a click event.

rahul 2009-07-01 11:56:13

OK - I'll give that a go this afternoon then, thanks.

Chris 2009-07-01 11:57:36

This has worked and looks ok - thanks for the suggestion.

Chris 2009-07-01 13:41:37

Great.....................

rahul 2009-07-01 14:02:05

This link might help - but change the css to needed color/font

DVK 2009-07-01 11:39:26

Nope - afraid this doesn't solve it. The font still has an embossed style when doing this.

Chris 2009-07-01 11:49:44

ansaurus

tags:

views:

answers:

Disabled Buttons in CSS?

related questions