Streaming live at 10am (PST)

Centering Images Horizontally


#1

Hi,

I'm relatively new to webflow, so please excuse the probable simplicity of this issue!

I have a column and in the column I want to centre, horizontally, two images with the same class, next to each other. Pressing auto just centres the images vertically.

If I float left and then manually move the images to the 'centre' in the editor, they won't be properly centrally positioned when published and I suspect won't be properly centered on different size screens.

Please help!

Thanks,

Dan


#2

Can you share the project or give an example?


#3

Ok, so here's an example.
In the pic below is a Section with an image of a double arrow, properly centered using the auto function. Below it is a Section>Container>3 Columns

In Column 2 there are 2 images, both have the same class. They are set as an Inline Block.

I want to centre both the images, next to eachother in Column 2. If I do this using 'auto', they automatically become display blocks, resulting in:

So they vertically stack.

If I then float left the icons, they revert back to:

I can then 'push' the icons to the centre using the positioning tool, but then doing that manually would not necessarily mean that the icons will be properly centered and when previewing or publishing the site, the icons seem to move away from the central position.

Hope this helps the understanding!

Dan


#4

Put a class of text align: center on the images, or on the on the column they're in.


#5