Friday, July 12, 2002
Them darned fancy <HR>s …
I've been following dive into mark's 30 days to a more accessible weblog and so far, everything he's said to do I've pretty much done with this weblog.
Today's
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 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).
