Is there a vr (vertical rule) in html?

Question

I know there is a hr (horizontal rule) in html, but I don\'t believe there is a vr (vertical rule). Am I wrong and if not, why isn\'t there a vertical rule?

Answer 1

In the context of a list item being used as navigation a <vr /> tag would be perfectly useful. The reason it does not exist is because "It does not make logical sense to have one" in the context of HTML a decade ago.

Answer 2

I find it easy to make an image of a line, and then insert it into the code as a "rule", setting the width and/or height as needed. These have all been horizontal-rule images, but there's nothing stopping me (or you) from using a "vertical-rule" image.

This is cool for many reasons; you can use different lines, colors, or patterns easily as "rules", and since they would have no text, even if you had done it the "normal" way using hr in HTML, it shouldn't impact SEO or other stuff like that. And the image file would/should be very tiny (1 or 2KB at most).

Answer 3

No, there is no vertical rule.

It does not make logical sense to have one. HTML is parsed sequentially, meaning you lay out your HTML code from top to bottom, left to right how you want it to appear from top to bottom, left to right (generally)

A vr tag does not follow that paradigm.

This is easy to do using CSS, however. Ex:

<div style="border-left:1px solid #000;height:500px"></div>

Note that you need to specify a height or fill the container with content.

Answer 4

How about:

writing-mode:tb-rl

Where top->bottom, right->left?

We will need vertical rule for this.

Answer 5

For use in HTML email for most desktop clients you have to use tables. In this case, you can use <hr> tag, with necessary (but simple) inline styling, like:

<hr width="1" size="50">

Of course that styling with CSS is more flexible, but GMail and similar don't allow using of any CSS styling other than inline...

Answer 6

I know I am adding my answer very late, but it would be worth I am sure. You can achieve vertical line using flex and hr

See my codepen here.