Centre an Image and Text Widgets in Row


#1

Hello,

I was just wondering if it is possible to centre an image widget both horizontally and vertically with text in a row which has been split 50%/50%.

Example here : Screenshot

I’m using the page builder and have an image widget in one half and a text widget in the other of the same row

Many thanks for your advice in advance,
Noah


#2

Hi,

It could work with a bit of custom CSS. Something like this:


#pg-xx-x .panel-row-style {
   display: flex;
   align-items: center;
}

where #pg-xx-x is the ID of the row you want to target. Share a link if you don’t know how to find the ID.


#3

Nevermind, didn’t notice you had the image on your site. This will do it:


#pg-208-6 .panel-row-style {
     display: flex;
     align-items: center;
}

For the other blocks on that page you just need to replace 6 with the row position. Note that this will center relative to the whole row height, so text + widget title, not just the text.


#4

Hi Vlad,

Thank you for your reply and sorry its taking so long to get back to you.

I have tried adding this CSS with the ‘Simple Custom CSS Plugin’ and it doesn’t seem to centre the image to the middle of the text.

Here is a link - http://genesis2015.co.uk/our-partners/

Please could you advise?

Thanks Noah


#5

i got the Sydney Pro and created a "Layout builder’ with 2 widgets that cant align. now to center. i tried the above CSS codes that i so in the forum but it ether aligns to the right or left but not center. the code says center.
primealarms.com, if you scroll down is the next page “protecting your home” with 3 icons below"
any help will be appreciated.

thanks
A.K


#6

I changed now to Sydney type A services and still the same thing please advise with a CSS