How to hide paragraph having no class using css?

Question

I am having dynamic pages and contains div and paragraph like this for example:

<div class="oe_view_nocontent">
    <p class="oe_view_nocontent_create">
        Click to add a contact in your contacts directory.
    </p>
    <p>
        Odoo helps you easily track all activities related to
        a customer: discussions, history of business opportunities,
        documents, etc.
    </p>
</div>

What i am trying is show only that paragraph which has class="oe_view_nocontent" and hide the other one who has no class.

I tried to sort out by using these threads:

Hide long text except the first two paragraphs

CSS: hide table with no class or id

I tried:

p {
    display: none;
}
p.oe_view_noontent {
  display: div;
}

and from here: Can I write a CSS selector selecting elements NOT having a certain class?

My try:

p:not(.class) {
    display: none;
}

But i am not getting anything. I just want that

who has

class="oe_view_nocontent_create"

Any idea where i am doing mistake?

`:not(.class)` means elements not having the class `class`. If you want them not to have the attribute `class`, use the attribute selector. `:not([class])`. — Niet the Dark Absol, Feb 15 '19 at 17:39
did you try p:not(:class) or p:not(.oe_view_nocontent_create) — Naga Sai A, Feb 15 '19 at 17:42
p:not(.oe_view_nocontent_create) works fine - https://codepen.io/nagasai/pen/rPqXjV — Naga Sai A, Feb 15 '19 at 17:42

score 2 · Answer 1 · answered Feb 15 '19 at 17:56

2

I think, you are looking for not:() selector.

p:not(.oe_view_nocontent_create) {
    display: none;
}

answered Feb 15 '19 at 17:56

Gaurav Saraswat

1,353
8
11

yep thnx. This has been answered by Naga Sai – user3162878 Feb 15 '19 at 18:14
ohh. i didnt notice that :) – Gaurav Saraswat Feb 15 '19 at 18:21

Naga Sai A · Accepted Answer · 2019-02-15T19:38:40.170

Posted comment as answer

p:not(.oe_view_nocontent_create) {
  display:none
}

<div class="oe_view_nocontent">
    <p class="oe_view_nocontent_create">
        Click to add a contact in your contacts directory.
    </p>
    <p>
        Odoo helps you easily track all activities related to
        a customer: discussions, history of business opportunities,
        documents, etc.
    </p>
</div>

codepen - codepen.io/nagasai/pen/rPqXjV

How to hide paragraph having no class using css?

2 Answers2