CODEWITHSUNDEEP
htmlcss
Lrerwe Rwerew
Lrerwe Rwerew

Reputation: 1

Apply CSS properties to class but only if element has another specific class

I have this html:

 <li class="arrow branches"></li>
 <li class="arrow branches"></li>
 <li class="arrow branches"></li>

 <li class="arrow"></li>
 <li class="arrow"></li>
 <li class="arrow"></li>

I want to give css commands only for "arrow branches" classes,how can I give them css that wont effect the "arrow" classes?

Upvotes: 0

Views: 212

Answers (3)

George
George

Reputation: 36784

Create the class .branches:

.branches{
    color:#f00;
}

If you want to apply it to only those elements that have branches and arrows then put them together:

.arrow.branches{
    color:#f00;
}

But if you want to apply it to more than one class thats easy too:

.branches, .otherClass{
    color:#f00;
}

Upvotes: 4

Kyle
Kyle

Reputation: 67194

It's extremely simple: 

li.arrow.branches
{...styles...}

This selects LI elements with the classes branches AND arrow, but not arrow on its own.

Upvotes: 2

JNDPNT
JNDPNT

Reputation: 7465

.arrow.branches { // your css }

Works only for elements with both classes.

Upvotes: 0

Related Questions