Streaming live at 10am (PST)

Uniform alignment blocks in width

Hi, whether it is possible to make uniform alignment blocks in width like here?
i tried use text-align: justify for inline-blocks, but it did not work.

They made it with list elements with inline-block, and the last li element has an extra class with these properties:

ul li.helper {
  width: 100%;
  height: 0px;
  visibility: hidden;
  overflow: hidden;

The last element acts like a hidden ruler. I don’t know if it would work with divs… try it :slight_smile: Only width:100% makes the 5 other li have an even separation. The other properties are to mask the ruler element.

It’s a neat trick I didn’t know about :smile:

There’s a new element called Flexbox that does exactly that without hack. Not yet in Webflow though.

Thanks. Unfortunately with divs this method does not work :pensive:

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.