This is a test of the br in Grid

What happens to HTML elements that don't have content?

This is a paragraph.

The item before this item is a br.

What did that do?

What about this next item, a wbr?

What does a hr do? Let's find out by putting an hr in

And what about other weird things?

Any other elements that don't take content?

The hr above this box becomes a vertical line. Hillarious! Why? Because it has `margin: 0.5em auto;` on it. And once it's a Grid Item, the stretch stretch collapses the box to 1px in the inline direction (where it's auto), and stretches the block direction (`margin-block-start: 0.5em; margin-block-end: 0,5em;`) almost the full height of the box.

If we change the hr's margin to be 0, the hr expands into a box that's the full size of the cell. See to the left.

If you want an hr line that's a horizontal line, you can change the margin to `margin: 0;` and the alignment to `align-self: center`. See next box:

Ta da! Meanwhile, we can't mess around with the `br`, because it can't be targeted with any CSS selectors. So it can't be placed elsewhere on the Grid. It can only live where it's autoplaced. It can't be styled in any way.