Friday, 28 July 2017

Complex CSS selector for parent of active child




Is there a way to select a parent element based on the class of a child element in the class? The example that is relevant to me relating to HTML output by a nice menu plugin for http://drupal.org. The output renders like this:




  



My question is whether or not it is possible to apply a style to the list item that contains the anchor with the active class on it. Obviously, I'd prefer that the list item be marked as active, but I don't have control of the code that gets produced. I could perform this sort of thing using javascript (JQuery springs to mind), but I was wondering if there is a way to do this using CSS selectors.



Just to be clear, I want to apply a style to the list item, not the anchor.


Answer



Unfortunately, there's no way to do that with CSS.



It's not very difficult with JavaScript though:



// JavaScript code:
document.getElementsByClassName("active")[0].parentNode;


// jQuery code:
$('.active').parent().get(0); // This would be the 's parent
  • .

  • No comments:

    Post a Comment

    casting - Why wasn't Tobey Maguire in The Amazing Spider-Man? - Movies & TV

    In the Spider-Man franchise, Tobey Maguire is an outstanding performer as a Spider-Man and also reprised his role in the sequels Spider-Man...