[Solved] Disorder problem with grid elements

Support Themes & Styling
1

I use the deliver theme and have a problem in services/_intro

There are six elements which are all beautifully ecually ordered when the length of the text is equal.

After changing to random text length, the layout breaks (looks like missing clears).

Is there a quick known fix?

2

Could you provide some more details please? Some code, or screenshot perhaps?

3

2017-08-06-185154_1920x1080_scrot
2017-08-06-185154_1920x1080_scrot.png1394×764 24.5 KB
2017-08-06-185347_1920x1080_scrot
2017-08-06-185347_1920x1080_scrot.png1564×868 32.4 KB

Thank you for your interest!
Here are two files, one with equal text and on the other one item 1 with double length text.

4

It’s not broken, it is how the theme is designed.

5

Do you have an idea how I can bring it to the desired order?
1, 3, 5 should stay on the left side, while 2, 4 and 6 should stay on the right side.

6

Well, there are few options regarding CSS and template code, let me take a look and think about it :slight_smile:

1 Like
7

Hello,

You could add this in your custom css:

.modular .bottom .services .service {
float: none;
display: inline-block;
width: 49%;
vertical-align: top;

It should to the trick. :wink:

1 Like
8

Thank you very much. That’s much better!
I will take a deeper look into it :slight_smile:

edit:
I just ve added another line. This is exactly what I need :slight_smile:

.modular .bottom .services .service {
float: none;
display: inline-block;
width: 49%;
vertical-align: top;
text-align:left;
}
1 Like