for practical use of CSS
copyright © CSSPG, lud May 12 2002
for practical use of CSS
Workarounds: HR A frequent question in HTML authoring newsgroups is how to add colour to an <HR>. The unsatisfactory answer is that you can't - for Netscape, which doesn't understand the color attribute for <HR>. Only marginally more satisfactory is using CSS to suggest a bottom border for HTML elements, simulating the <HR>, whilst adding colour.
Using markup similar to:
H1.workaround {border-bottom-width: 3pt;
border-style: solid; border-color: #cc3333;
width: 100%; font-size: 1.8em;
font-weight: bold;}
H1.workaround {border-bottom: 3pt solid #cc3333;
border-top: 0 solid #f0f0f0;
border-left: 0 solid #f0f0f0;
border-right: 0 solid #f0f0f0; }
Warning: If you use something like this, be sure to change the colour from '#f0f0f0' to the background colour used in your <BODY> declaration.
The actual markup required to suggest similar rendering is bloated, due to browser compliance issues. Opera 3.5+ nor IE 4.0+ support the CSS property 'border-bottom-width', although they do support the shorthand 'border-bottom'; Netscape doesn't support the shorthand, but does support 'border-bottom-width'. Because Netscape's CSS implementation is so broken, it was necessary to add suggestions for font-size and font-weight to the declaration.
Not to be generally recommended (even as a workaround), redundant declarations were the only method found to suggest similar renderings. The more compliant Opera and IE pick up the font-weight and font-size rules from the first declaration, and render the second declaration. Netscape uses the tailor made first declaration, and ignores the second one.
The last example is to answer a question in an Opera newsgroup.
CSS Pointers Navigation
Main Site Navigation
