Appy Mistry Appy Mistry - 3 months ago 6
CSS Question

How do I hide an element based on partial HREF?

I am trying to hide some specific adds on my page based on their

href
property(using CSS). I scrolled through some of the answers which tells about hiding an element based on its
href
value. But, the element here is quite dynamic and keeps changing every time I load the page. Is there any way to hide an element/anchor based on its partial
href
value ?

Below is the HTML code that I am trying to hide.

Code:

<div id="union-ad" class="union-banner">
<a href="http://someURL?Dynamic_Id's">
</div>


This is what i have been trying so far.

<style type="text/css">
a[href='someURL']{ display: none }
</style>

Answer

Use a substring selector:

a[href^="http://someURL"] {
  display: none;
}
<a href="http://otherURL.com?hey">You CAN see me.</a>
<a href="http://someURL.com?hey">You can't see me!</a>

Comments