Don't apply CSS to
containing an

Question

Possible Duplicate:
CSS selector for “foo that contains bar”?

All the <p> on my site get margin-bottom of 20px.

I don't want to apply this margin-bottom to <p> which contain an <em> element.

Is it possible to this without classes or id's.

CSS3 can be used.

It was supposed to be a quick fix for one the users of a Wordpress plugin for me. I can't fix it right now so I at least wanted to present him some kind of workaround. — Hedge, Jul 23 '11 at 14:37

score 2 · Accepted Answer · edited Dec 07 '22 at 13:11

2

To apply style to all p not containing an em:

p:not(:has(em)) {
    margin-bottom: 20px;
}

~~I'm afraid this isn't possible with pure CSS.~~

edited Dec 07 '22 at 13:11

Mikael Dúi Bolinder

2,080
2
19
44

answered Jul 23 '11 at 13:43

PeeHaa

71,436
58
190
262

score 1 · Answer 2 · edited May 23 '17 at 10:30

1

Unfortunately, there is no way to do this with pure css. See Is there a CSS parent selector?

You could use some jQuery though.

$('em').parent().css('marginBottom','0');

http://jsfiddle.net/jasongennaro/5pPGF/

edited May 23 '17 at 10:30

Community

1
1

answered Jul 23 '11 at 13:46

Jason Gennaro

34,535
8
65
86

score 1 · Answer 3 · edited May 23 '17 at 12:02

1

The only way I could see doing this in pure CSS is with a parent-node selector. Unfortunately, such a thing does not exist in CSS2 or CSS3.

edited May 23 '17 at 12:02

Community

1
1

answered Jul 23 '11 at 13:47

aroth

54,026
20
135
176

score 1 · Answer 4 · answered Jul 23 '11 at 13:47

1

What you're describing is basically an "ascendent" selector, selecting some element based upon its descendents. This isn't possible using just CSS, you would have to also use JavaScript.

answered Jul 23 '11 at 13:47

dbb

1,100
6
12

score 1 · Answer 5 · answered Jul 23 '11 at 13:50

1

Pure CSS does not do that (yet) as far as I know, but you can achieve this by smart use of jQuery:

$(function() {
    $("em").parent("p").addClass("nomargin")
})

Or something like that...

answered Jul 23 '11 at 13:50

Roland Tepp

8,301
11
55
73

score 0 · Answer 6 · answered Jul 23 '11 at 13:44

0

Your question is unclear. Pleae recheck your question. But you can set margins, paddings for global tags like

p{margin:0}

or

*{margin:0; padding:0 } for all elements then change it for exact divs, classes. In that case all other ones still will set to margin:0, padding:0

answered Jul 23 '11 at 13:44

Tural Ali

22,202
18
80
129

1

He wants to give
tags that have an element inside of them different formatting, as compared to a
tag without an . Without setting classes or IDs.
– please delete me Jul 23 '11 at 13:47
ok. understood. one sec. – Tural Ali Jul 23 '11 at 13:51

Don't apply CSS to containing an

6 Answers6

Don't apply CSS to
containing an