<hr> is the HTML tag to draw a horizontal line across the page.

Like ^that^.

HR stands for Horizontal Rule.

Creating white space with the <hr> tag

The standard <hr> tag looks like this:


whereas the truncated tag, using <blockquote><hr></blockquote> extends across less of the page:

The line will still resize with the window, but gives horizontal white space. It has the secondary advantage of creating white space above and below the line as well. (I have used this where I want to create a less cluttered, more open look to a writeup, as in my homenode.) It allows the eye to continue scanning down more easily, by making the break less challenging, encouraging the reader to continue past the rule.

Multiple <blockquote></blockquote> pairs may be used to create shorter lines.
<blockquote><blockquote><hr></blockquote></blockquote> gives you:


By adding more pairs, the line can be shortened considerably.

Finally, a <p> before and after a rule gives vertical white space without truncating the line:



Very short lines

This works well for longer lines, but becomes clumsy if you want a very short line, for example:


There an attribute to alter the length of the rule, which was pointed out to me by Blue_Bellied_Lizard. For lines of absolute length, E2 accepts <hr width=100>, for example, which is what was used for the line above. Please note that the <hr width=50%> method for getting a line as a percentage of the window or frame width, does not work in E2!

Care has to be taken, as making the line too long will mangle the window, as the browser does not size it with the window. This will upset your readers. Blue_Bellied_Lizard says "...width is only good for very short lines, because it is absolute" (i.e. a number of pixels width), and he is right. If you need a short, short line, use width=xxx, but keep the numbers low. I tend to use 150.

Log in or register to write something here or to contact authors.