Using the same technique as for vertical bars, we can simply add flex-direction
on the container
with a value of column
to create a set of horizontal bars. flex-direction
can have a value of row
(default) or column
, where a row
runs horizontally (→) and a column
runs vertically (↓). You can also reverse the direction of both by using row-reverse
(←) and column-reverse
(↑) respectively.
demo
- HTML, CSS
- Includes: index.html and CSS file