1

Say I have the following mark up

<div class="xxx yyy zzz"> <!-- This div is generated by JS and the class names change all the time -->
   <div class="aaa"> Hello </div>
</div>

How can I target the css of the parent div without knowing the class name of the parent div using CSS only ?

Ex: parent.aaa { background: #fff; }
user1038814
  • 9,337
  • 18
  • 65
  • 86
  • 1
    You cannot: http://stackoverflow.com/a/1014958/1048479 – Nick Tomlin Aug 09 '13 at 20:35
  • 1
    You can't, CSS has no parent-selector. With JavaScript yes, CSS no. And despite what you may read elsewhere [CSS 4 does *not* offer this](http://dev.w3.org/csswg/selectors4/#profiles) (as currently written, at least). – David Thomas Aug 09 '13 at 20:35
  • you need jquery's .parent() – Nilzone- Aug 09 '13 at 20:37
  • As people told, no CSS parent selector. For JS (jQuery for e.g.), you could create `.aaa-parent { background: #fff; }` on CSS and then on jQuery `$('.aaa').parent().addClass('aaa-parent');` – RaphaelDDL Aug 09 '13 at 20:37
  • http://stackoverflow.com/questions/1014861/is-there-a-css-parent-selector/1014958#1014958 – Muhammad Umer Aug 09 '13 at 20:45

2 Answers2

1

It's not possible to target a parent of an element with CSS. Would be nice!

You could use javascript to find the element and then add a class to the parent, then style that added class:

// javascript - jquery
$(".aaa").parent().addClass("parentClass");

// css
.parentClass {
    ... your styles ...
}
Tim Kindberg
  • 3,605
  • 1
  • 25
  • 26
0

In CSS there are no parent selectors, but you can use Javascript 

element.parentNode