Hi,
I have a page with 4 columns, This is going just fine on larger screens and iPad landscape mode. But when in portrait mode on an iPad the 4 columns are still on one row which doesn’t look very nice. How can I change the breakpoint to have the 4 column row break into 2 x 2 column row on smaller screens? On an iPad in portrait mode for example.
Cheers,
Jaap
have a look to your column – do you have choosen equal height?
this ends in a display : table-cell and makes it not possible to break in your manner.
Try to give the column a “individual height”
than i believe that it is the default behavior to go to 2/2 rows.
If not it is possible to set some media querries
Hi!
@Guenni007 Thanks you for your help!
If this is how you like the 4 cols to look in mobile
Please add the below CSS in Enfold > General Styles > Quick CSS
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all .flex_column {
width: 47%!important;
float:left;
margin-right: 3%!important;
}
}
Regards,
Vinay Kashyap