Create gap between columns

[nikolaus_k]

hey, my columns look bad on mobile phones. how can I put a gap between the columns so they don´t stick together like in the picture. I already added “mbs” in the “class”, but I need more margin, as u can see in the picture.

[jade]

Hi there,

Please add this code to the Global CSS:

@media(max-width: 767px) {
    .x-container .x-column:not(:last-child) {
        margin-bottom: 1.2em !important;
    }
}

Please check these links to the references of the code above:
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
https://www.w3schools.com/css/css_margin.asp
https://www.w3schools.com/cssref/sel_not.asp
https://www.w3schools.com/cssref/sel_last-child.asp

Hope this helps.

[nikolaus_k]

I´ve put the code in the CSS but it didn´t work. Any other ideas?

[jade]

Hi there,

Please make sure you have included the !important declaration in the CSS code.

Also, feel free to increase the value of the margin bottom.

Hope this helps.