Home/ Questions/Q 6530773
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T09:47:46+00:00

We’ve got a site wide style sheet that’s setting the background on a:link to

  • 0

We’ve got a site wide style sheet that’s setting the background on a:link to transparent. This is causing a problem displaying the icons from jqueryui. In the example below the trash can icon associated with the ui-icon-trash CSS class is not being displayed because the a:link background property overrules it.

I could apply the same styles ui-icon-trash uses to the link in question but that will be fragile if the jqueryui theme were ever to be updated in the future. Is there a way I can get the jqueryio icons to display at the same time as having a site wide background:transparent property on a:link?

<html>
  <head>
 <link rel="stylesheet" type="text/css" href="jquery-ui.css" />
 <style>
   a:link {
    text-decoration: underline;
    color: #066E37;
    background: transparent;
    } 
  </style>
   </head>
   <body>
     <a class="ui-icon ui-icon-trash" href="#"></a>
    </body>
 </html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I don’t see a real solution there, but I can offer two hacks:

    1. Put an additional <span> inside the <a> and apply the css to this element.

    2. Don’t use <a> but <button> instead. Drawback: this would require additional javascript to make the button work.

    If it is sufficient to override only the background color of your links, background-color: transparent instead of background: transparent could do the trick (but I guess you might have thought of that already).

    • 0