CSS

475 readers

1 users here now

founded 1 year ago

MODERATORS

Ategon@programming.dev

tappyturtle@programming.dev

CSS, select an element that have div:not(something) possible ? [ solved ] (programming.dev)

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

2 comments fedilink hide all child comments

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 (1 children)

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()