Center two columns in a row - image and text

Support
#1

Hi guys, having issues with centering the image vertically according to the text next to it on this page: https://kryptonitecreative.com/services screen grab: https://prnt.sc/ij0hhs

Checked out this forum thread: https://theme.co/apex/forum/t/center-two-columns-in-a-row/23704 and tried to use a similar css code, but it didn’t work:

@media (min-width: 768px){ .x-column x-sm x-1-3 { display: flex; align-items: center; } }

This

 vertical-align: middle;

doesn’t seem to be working either. Would really appreciate your help!

Petar

#2

Hi There,

Please try with this CSS instead:

.page-id-105 #x-section-6 .x-container.max.width {
    display: flex;
    align-items: center;
}

Hope it helps :slight_smile:

#3

Hi, yes it does - the image is vertically centered now, it also shows next to the text in small screens instead above it: https://prnt.sc/ijcorx

#4

Hi There,

Please update the previous CSS to this:

@media (min-width: 768px){
.page-id-105 #x-section-6 .x-container.max.width {
    display: flex;
    align-items: center;
}
}

Hope it helps :slight_smile:

2 Likes
#5

Works great, thank you so much!

#6

You’re welcome! :slight_smile:

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.