I'm working on an inherited webpage. Specifically trying to implement a print.css (there wasn't any print.css up till now).
The previous developer has put in ...
<hr class="hidden" />
The CSS for this in the main css is (unsurprisingly):
.hidden {
display: none; }
... at points which separate the major sections of the page. Wondering if anyone can say why this might be useful?
There's no separate print.css though it's possible he intended to implement one and ran out of time. The page is nicely designed, so I am assuming the previous guy knows what he's doing.
Definition and Usage The <hr> element is most often displayed as a horizontal rule that is used to separate content (or define a change) in an HTML page.
Horizontal rules are used to provide a visual break and divide content. In most cases, <hr> tags are used for visual purposes only. Therefore, it does not need to be announced by a screen reader. Add the attribute aria-hidden="true" so screen readers will ignore the element.
The <hr> tag is an empty element. This means that it only has an opening tag, <hr> . Starting in HTML5, we now need to attach a slash to the tag of an empty element.
The <hr> tag is empty, which means that the closing tag isn't required.
It's indeed very probable he wanted the print version of the page to have a horizontal line there. In that css he probably would have defined the "hidden" class as being "display: inline".
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With