Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS selector with class a but not class b

Tags:

I've tried all sorts of things but I think i'm getting too complicated and even managed to get chrome to hang with my selector. I'm sure theres a simple way to do this

Select classa but only when theres no classb and ignore the last instance of it

<div class="container">     <div class="classa classb"></div> <!-- Dont Select -->     <div class="classa"></div>  <!-- Select -->     <div class="classa"></div>  <!-- Dont select last instance --> </div> 
like image 419
Tarang Avatar asked May 27 '12 09:05

Tarang


People also ask

What CSS selector should we use if we want to select all elements but not the specified class or selector?

For selecting everything but a certain element (or elements). We can use the :not() CSS pseudo class.

What are the 3 different kinds of selectors in CSS?

Simple selectors (select elements based on name, id, class) Combinator selectors (select elements based on a specific relationship between them) Pseudo-class selectors (select elements based on a certain state)

Can you make a class selector particular to an element type in CSS?

The .class selector selects elements with a specific class attribute. To select elements with a specific class, write a period (.) character, followed by the name of the class. You can also specify that only specific HTML elements should be affected by a class.


1 Answers

I believe you can do this with CSS3 using the :not() selected (example here)

div.classa:not(.classb):not(:last-child) {}

However, as you know, not many browser supports this, so Javascript might be an easier way...

like image 122
LeeR Avatar answered Sep 30 '22 19:09

LeeR