Good day.

There is a tile of categories http://rose.e-tickets.org.ua/cvety/ However, for some reason, the 5th element is transferred to the right. And should go left. Tell me what could be the problem?

  • one
    Your 4th element has a different height. Put all the blocks to the same height and everything will be fine - Yuri
  • one
    or insert <div style="clear:both"></div> after the 4th element. This is an example, the style, of course, needs to be brought to the class - Maximmka

1 answer 1

Why?

Your items have slightly different heights. enter image description here

And even despite the difference less than 1 pikela, because of this, the element is transferred to a new line.

What to do?

You can give all elements a fixed height (for example, 198 or 199px) and this will fix the situation.

Tell me what could be the problem?

But the problem is generally in the use of layout with hacks float, clear, etc. Use flexbox. If you give the container display: flex; flex-wrap: wrap; display: flex; flex-wrap: wrap; then your problems will be solved.