Combine CSS styles applied to ASP controls

Question

I am using DevExpress controls on ASP Web Forms Application. I would like to have different disabled styles for my buttons, so I've created some styles:

.dxmLite_Moderno .dxm-disabled, .dxmLite_Moderno .dxm-disabled a.dx {
    color: rgb(1, 211, 211);
    border-style: none !important;
    height: 36px;
    padding-top: 2px;
}
.red {
    color: rgb(255, 0, 0) !important;
}
.blue {
    color: rgb(0, 255, 0) !important;
}

First override style of button if it's disabled. Second is overriding buttons which have:

<dx:MenuItem ItemStyle-CssClass="red" Text="D" ItemStyle-Width="104" Name="I">

ItemStyle-CssClass called 'red'.

Now question is - it's possible to combine those css styles in way:

if button is disabled and red => have style red
if button is enabled and red => I dont want any style
if button is disabled and blue => have style blue
if button is enabld and blue => I don't want any style

I am asking because now situation looks like if I have enabled / disabled button red it's always color of style red.

If you do not care for IE less than 9, check out this [thread](http://stackoverflow.com/questions/11600687/hover-and-active-only-when-not-disabled) — Andrei, Jul 03 '14 at 10:49
It didn't solve the problem, but it's nice possibility if you use standard controls — boski, Jul 03 '14 at 11:20

score 1 · Accepted Answer · answered Jul 03 '14 at 11:04

1

What is important you have wrong blue definition color.

Second remove any !important from css.

And finally combine dxm-disabled class with your colors class:

.dxmLite_Moderno .dxm-disabled.red {
    color: #f00;
}
.dxmLite_Moderno .dxm-disabled.blue {
    color: #00f;
}

I create the demo for you: http://jsfiddle.net/YQG9B/1/

answered Jul 03 '14 at 11:04

WooCaSh

5,180
5
36
54

Blue definition defines blue buttons (they have blue backgrounds), not text or caption colour. ( ͡º ͜ʖ͡º) – boski Jul 03 '14 at 11:19

Combine CSS styles applied to ASP controls

1 Answers1