Send things to the left and the right

float also takes the value right. The element you set it on floats over to the right.

left on the group on the left, right on the group on the right. That alone sends them to the two edges.

Put float: right; on several elements and the one written first ends up furthest right, because they pack in from the right.

If the order comes out backwards from what you meant, remember this.

Set the height of the band and give the left and right groups the same line-height, and the words line up vertically. The move from the beginner chapter works here as it is.

That gives you the shape of a header.

text-align: right; pushes the words inside a box to the right; the box itself does not move.

To move the box itself, use float: right;. They look alike but they have different jobs, so do not mix them up. Have a go.