Centering icons and text responsively in mobile view

Hi,

On my home page on mobile view (iPhone X) the six ‘buttons’ (not exactly buttons but they look like medium-sized rectangles with rounded corners in different colours) which each say 'CARPENTRY; ELECTRICAL; EXTERIOR; PLUMBING; DECORATING and ODD JOBS) the text is too far over to the right and the icons are not vertically centred. They look great on desktop view but how can I control the positioning better in mobile view?

I did this WP Bakery in 2015. I would like to use cornerstone - is there any way of migrating this over to using cornerstone now?

Hey @jimmillard,

Thanks for reaching out!

There is some error on your website, please fix it first so that we can check on your items.

Thank you.

Hi there,

The website is now fixed. Thanks!

Hello @jimmillard,

I would suggest you please add this custom CSS code to the page CSS or global CSS code to align the icon to the
mobile devices.

@media(max-width:480px){
span.icontool {
    margin: -35px 0;
}
}

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case if you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

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