CSS bug
in
3 posts,
2 voices
Vaer
Scriptwright
|
I've run into a case which are like this on Stack Overflow. original html:
<div title="this question has an open bounty worth 100 reputation" class="bounty-indicator"> +100 </div> after text to link:
<div title="this question has an open bounty worth 100 reputation" class="bounty-indicator"> <span> <a href="tel:+100"> +100 </a> </span> </div> The problem occurs because the css applies a blue background to .bounty-indicator and a blue color to all links:
.bounty-indicator {
background-color:#0077DD;
color:white;
}
a {
color:#0077CC;
}
The only solution I can think of is if you assign a class to the links and spans and add CSS that makes them inherit their color and have a transparent background. |
Kim A. Brandt
Script's Author
|
... inherit the colour from where? I don't think this script should add any CSS to the links it's generating. What I like about the way it's done is that links inherit the styles from the CSS on the page they're on and for the position they're in. This makes them unobtrusive and fit right into the page together with existing links (most of the time that is). Maybe instead you could add some styles to your userChrome.css for the page you're talking about. |
|
Vaer
Scriptwright
|
Inherit from their parent:
(added spans), (added links) {
color:inherit;
background:transparent;
}
Although, it's just come to my mind that the real problem isn't the CSS. It's that "+100" shouldn't be made into a link? |
