How to give a css code for combined classes in HTML

Question

I have got two classes coming under list "active" and "main-tab-list like and want to give a css for this combined classes.

Answer 1

Just cascade them

 .main-tab-list.active{color:red;}

This ensures that only .main-tab-list which are active will be selected. Other classes who also have .active class on it won't be affected. It simply says, apply this rule to all .main-tab-list classes which at the same time have .active class

Answer 2

If you want special styles to be applied to elements that have both classes then use a rule such as:

.active.main-tab-list {/*note there's no space between .active and .main-tab-list*/}

If you want the styles to apply to elements that have either of the classes group them:

.active ,
.main-tab-list {/*newline is not required*/}

See also Select element based on multiple classes and http://www.w3.org/TR/CSS2/selector.html

Answer 3

you can combine it with comma. for example,

.active,.main-tab-list{color:red;}