Centre image in column

Support
#1

Good morning,
We are creating a multi-langual site. In the Dutch site - we created first - on the home page we have 2 rows with 3 columns - that are buttons to other pages. The images in those columns - in the Dutch site - are centred, as we want them to be. But in the Enlish site, I cannot seem to get them centred. The row and the column are centred. I think everything is like on the Dutch site, but it doesnot work.
Make the website very large and you can see the difference. On the front end - the Dutch images are as we would like it.

Can you please advice?

#2

Hi There @lvandeemter

Thanks for writing in! I have tested your English version of the homepage and I see that the images are centered as in your Dutch version. See secure note for the screenshot.

This could be a caching issue on your end. Could you please try clearing your cache and re-test this issue again.

Let us know how it goes.
Thanks!

#4

Hey @lvandeemter,

The correct and none coding setup for this case is as follows:

  1. Set the Image element’s Width to auto.
  2. Apply the background color to each Column.
  3. Set the Section’s Text Align option to Center.

Please watch this video to see the result of the setup

Below is the CSS in that video which is not recommended and we’ll not support issues that will arise from the use of it and further enhancement.

$el .x-image img {
  margin: 0 auto;
}

Hope that helps.

#5

Thank you.
Need to create this part again I think.
Thanks for you help

#6

On behalf of my colleague, you’re welcome. Cheers! :slight_smile:

#7

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