Can I define an exixting css class with different attribute in a different css class?

Question

I have a CSS class to show the portlet title :

.portlet-title {
    color: #FFFFFF; 
    font: bold 12px Arial, Helvetica, Geneva, sans-serif;
}

In another css file I've a class :

.lfr-grid.dragging {
    border-collapse: separate;
}

now I want to call the class .portlet-title in .lfr-grid.dragging with changing the color attribute as color: #000000

deceze · Accepted Answer · 2011-02-02 05:28:50Z

3

CSS is not about calling classes, it's about applying more or less specific styles.

Assuming a structure like this:

<div class="portlet-title">...</div>

which sometimes changes to this:

<div class="portlet-title lft-grid dragging">...</div>

you can simply apply a more specific style:

.portlet-title.lfr-grid.dragging {
    color: #000000;
}

answered Feb 2, 2011 at 5:28

deceze♦

525k89 gold badges806 silver badges954 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Cofey · Accepted Answer · 2011-02-02 05:28:25Z

0

You can accomplish this with the following:

.lfr-grid.dragging .portlet-title {
color: #000;
}

Note that .lfr-grid.dragging will not work in IE6 as it does not support chaining of classes.

answered Feb 2, 2011 at 5:28

Cofey

11.4k16 gold badges55 silver badges75 bronze badges