Image with Button which stays aligned when resizing

thanasikala

Hi there,

I'm new to Betheme and I'm just trying to figure out the best way to get a Image with a Button which stays aligned on different screen sizes.

My website is http://www.clearviewaluminium.net.au

Currently I'm using Zoom Box and Button like shown here https://ibb.co/q0T1z9Q

You can see in the screenshots below that when you are on a mobile sized device the three buttons do not stay below their images when resized.

https://ibb.co/bQ2Y9R2

https://ibb.co/Gf689k8

What is the best way of achieving the result I want? Does not have to look exactly the same.

Thank you,

Thanasi

Bryan

Hey,

this is because you placed all of the items inside a single wrap. When it goes to mobile, you have all of the items from left to right to appear under each other.

To avoid this, place three 1/3 wraps next to each other and insert one zoombox and button inside it.

This way you will have three wraps under each other and the button will be always below the zoombox.

You can also set the button to full width, just edit the button item options.

thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

thanasikala

Thanks! That worked perfectly.

Here is a pic after the changes just incase anyone else every tries to get their head around it

https://ibb.co/NNVx6T4