I've been following dive into mark [1]'s 30 days to a more accessible weblog [2] and so far, everything he's said to do I've pretty much done with this weblog.
Today's [3] entry is about the <HR> tag and how to change the look of them. The method he uses works, but is a bit of a kludge. Mostly because it supports Netscape 4x, which doesn't support CSS to any decent degree.
That's why I've forgone Netscape 4x support entirely. How I do it is the way it's supposed to be done. First off, in the HTML (HyperText Markup Language) for this page, I hide the style sheet from Netscape 4x:
<SCRIPT> @import "/bdstyle.css"; </SCRIPT>
Netscape 4x doesn't suport “@import” so nothing gets included (thankfully, else my style sheet would crash it, hard). The style sheet then has:
HR.next
{
width: 50px;
height: 16px;
border: none;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
padding: 0;
background-image: url(hr.gif);
background-repeat: no-repeat;
background-position: center;
}
Then in the HTML page, to use the image, I do:
<HR CLASS="next">
And I have my fancy <HR>. And it works fine under the current versions of Netscape (6x), Mozilla (from about 0.9.2 on up), Opera and Internet Explorer (although those last two draw a faint grey border around the image).
[1] http://www.diveintomark.org/
[2] http://diveintomark.org/archives/2002/06/14.html#day_5_belated_introduction