Trying to style a horizontal rule in IE 6/7.
Posted: Mon Apr 23, 2007 5:51 pm
This seems so simple and obvious, but basically I'm now fixing some broken IE CSS on my rewritten website. Luckily most of the issues are aesthetic rather than strucutral but this one has me stumped. I tried styling my horizontal rules to be a chunky bar with a repeated diagonal stripe background. It works in FF, Opera, Safari. It almost works in IE, but in IE there are dark edges around two edges of the rule which I cannot seem to get rid of.
There are things in that CSS I've added in desperation but can anyone see where these dark lines are coming from in IE?
You can see the page at http://trunk.swiftmailer.org/ to know what I'm talking about (ignore the other CSS issues... I'm probably already working on them right now
)
Cheers
EDIT | Never mind this fixes it, but contextually it's not what I wanted. At leats the rule will show in non-CSS browsers though
Code: Select all
hr {
display: block;
padding: 0;
height: 20px;
margin: 10px 0;
background: none;
background-image: url(/images/stripe.gif);
border: none;
}You can see the page at http://trunk.swiftmailer.org/ to know what I'm talking about (ignore the other CSS issues... I'm probably already working on them right now
Cheers
EDIT | Never mind this fixes it, but contextually it's not what I wanted. At leats the rule will show in non-CSS browsers though
Code: Select all
<div class="rule"><hr /></div>Code: Select all
div.rule {
height: 20px;
background-image: url(/images/stripe.gif);
margin: 10px 0;
}
div.rule hr {
display: none;
}