[Darren BParticipant]

Hello,

Currently when I insert an image element in a column and wish to centre it, I am adding the following in the customised Style field:

margin-left: 15%; (value varies), sometimes using margin-top: also.

This works ok, but does not work so good when responsive on a mobile.

There must be an easier way to centre an image??

thanks

[AmanMember]

Hi there,

Please provide the following details so I could provide a custom CSS for your setup:

• WordPress URL: ______________________

Thanks!

[Darren BParticipant]

Hi,

URL:

http://pxpworld.com/worldibk/?page_id=7106

thanks

[AmanMember]

Hi Darrem
There are multiple images on that page. Eitherway, you could use this CSS to align the image in center:

.x-img{
display:block;
margin:0 auto;
}

Thanks!

[Darren BParticipant]

Thanks for your reply and sorry for my late reply.

Each image needs to be centred in the column.

Am I correct to say I need to put the above CSS in the Customizer and then use the class as follows?

[image class=”x-img” type=”none” float=”none” info=”tooltip” info_place=”right” info_trigger=”hover” src=”7133″ info_content=”Kaicho Henk Kuipers 9th Dan” link=”true” href=”#” title=”Kaicho Henk Kuipers 9th Dan”]

I have tried as above and the image does not centre.
As shown on top image on the page: http://pxpworld.com/worldibk/?page_id=7106

Am I doing it wrong?

thanks

[Kosher KMember]

Hi Darren,

You can try to remove the custom style you added directly on the element for centering an image and try to add this code below under Customizer -> Custom -> CSS

.x-img {
display:block;
margin:0 auto;
text-align: center;
}

This will center the image from its parent container.

Hope that helps.

Cheers

[Darren BParticipant]

Great! This worked. Thanks

[RadModerator]

You’re so welcome Darren!

[Author]

Posts