13
submitted 2 months ago* (last edited 2 months ago) by Rick_C137@programming.dev to c/css@programming.dev

Hi everyone,

I have something like this

<div id="container">

    <div>
        <div class="foobar"></div>
    </div>

    <div>
        <div class="foobar"></div>
    </div>

    <div>
        <div class="foobar"></div>
        <div class="barfoo"></div>
    </div>

    <div>
        <div class="foobar"></div>
    </div>

    <div>
        <div class="foobar"></div>
    </div>

<div>

I would like to select all the #container > div (the childs of container)

that do not have a div.barfoo in their childs.

is it possible with CSS ?

I'm at

#container> div :not(div.barfoo) {} 

but this is not working, and will select anyway #container > div > div

Any ideas ?

you are viewing a single comment's thread
view the rest of the comments
[-] Rick_C137@programming.dev 9 points 2 months ago

I've found

#container > div:not(div.barfoo)

seem to do the trick..

[-] morgunkorn@discuss.tchncs.de 4 points 2 months ago

Yeah the space after the first div in your post means that the :not() will behave like #container > div *:not()

this post was submitted on 08 Sep 2024
13 points (100.0% liked)

CSS

484 readers
1 users here now

founded 1 year ago
MODERATORS