Hr noshade with css

HTML & CSS
1

Okay while validating my website I ran into the an error with the hr property “noshade”. Is this essentially what
the details of noshade does? I was successfully able to get it to look the same with css

hr
{border-style: solid;}

I have included the error from w3 validator seen below:
The noshade attribute on the hr element is obsolete. Use CSS instead. <hr noshade/>

Yours cordially,
polyhedra (Daniel)

2

Hi,

Yes noshade is a deprecated presentational attribute and invalid in strict doctypes.

You can use border as you mentioned above to get a similar effect but if you need ie7/6 support then use the following instead.


hr {
	color:#808080;
	background:#808080;
	height:2px;
	border:none
}

Note than in older versions of IE you can’t reduce the vertical margins on the hr beyond a certain point which is why most people simply use the border on a div instead.

3

If you are looking for a line for visual styling, I’d suggest using a border on a block element rather than hr. <hr> is not really a presentational element. It has actual meaning in HTML.