- This topic is empty.
-
AuthorPosts
-
September 21, 2014 at 3:22 pm #183780
cozbaldwin
ParticipantHi, all. Hoping today’s conundrum is just a matter of simple oversight on my part.
I have a div I want to hide. It’s being created by a wordpress gallery-type plugin.
It has a class assigned, but it’s the same class that many others on the page are using. It does, however, contain an anchor tag with a unique href. And I cannot figure out the way to hide that div (if there is a way…).
EXAMPLE:
<div id="content"> <div class="album"><a href="1"></div> <div class="album"><a href="2"></div> <div class="album"><a href="3"></div> </div>
I am looking to hide the div that contains the link to 2.
And, unfortunately, using an nth-child selector will not work because the order of the albums will change as I add more albums.I was hoping I could write something like:
div.album[a[href*="2"]] {display:none}
(AKA: Select the div which contains the anchor tag which has the attribute of 2.)Yes, I know there’s a way with jquery, too. Looking for css solution, though.
Thanks!September 21, 2014 at 3:26 pm #183781chrisburton
ParticipantIt’s being created by a wordpress gallery-type plugin
Why not edit the plugin?
September 21, 2014 at 3:45 pm #183783cozbaldwin
ParticipantWhy not edit the plugin?
Honestly, I guess because I’m not sure how to do that so it generates a unique id on the div with every new album creation. This plugin mirrors (and links) to a picasa account. So when it sees a new album on picasa, it uses the picasa api to generate a thumbnail and link, then wrapping it in a div.September 21, 2014 at 3:55 pm #183784chrisburton
ParticipantHow are you outputting the data?
September 21, 2014 at 4:23 pm #183788cozbaldwin
ParticipantHow are you outputting the data?
I am not doing anything. It’s the plugin, which is using technology I’m not familiar with. I’m just an html/css guy and was hoping for a css selector solution.
Here’s the page in question. The div I want to hide is the one that contains the “Scrapbook Photos” album (and maybe some others if I get it working). http://www.thevillageplayers.com/photos/September 21, 2014 at 4:48 pm #183789__
ParticipantCSS simply doesn’t have a “parent” selector. If you want to hide the album using CSS only, you’ll need to change the plugin to add some unique attribute to the parent
div
that you can target.On the other hand, finding+hiding it with javascript is fairly straightforward:
document .querySelector('a[href*="Scrapbook"]') .parentNode.style.display = 'none';
All gone. Just be sure to choose a selector that only matches the one specific anchor you want.
September 21, 2014 at 4:52 pm #183791cozbaldwin
Participantok, well I’m glad at least I wasnt being a moron by overlooking some selector combination… though it feels like there would/should be.
Chalk it up to another reason for needing a parent selector added ASAP.
Thanks for your time, guys.
September 21, 2014 at 9:43 pm #183818__
ParticipantYou’re welcome. And just in case you’re interested, it’s not that no one thinks a parent selector wouldn’t be useful, it’s just that it’s difficult to implement with the way CSS works internally. The CSS4 spec has :has(). There was also a “subject selector” which allowed you to choose which part of a combination selector was the subject of the rule (as opposed to the last element automatically being the subject), but it seems they removed it.
September 21, 2014 at 9:58 pm #183824cozbaldwin
Participant… seems legit…
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.