Inline CSS to center column is ignored with using swapcolumns

Hi There,

I am using the vertical-align: middle; to my text columns, but also using swapcolumns to get the mobile layout. When doing so, it seems to then ignore the vertical align. Do you have any resolution for this?

what it should look like: https://prnt.sc/j6fn9o
what the swaped columns looks like: https://prnt.sc/j6fnjh

This is the website page that I am having the issues on:

Thank you!!

Hi There,

Please find this custom CSS:

@media (min-width: 768px){
.x-section .x-container.swapcolumns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}
}

And change to this:

@media (min-width: 768px){
.x-section .x-container.swapcolumns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    align-items: center;
}
}

Hope it helps :slight_smile:

All good! Thank you so much!!