How to make buttons centered only on mobile?

Viewing 2 replies - 1 through 2 (of 2 total)

  • Hi there! Thanks for contacting the www.ads-software.com support Forums!

    Usually (on responsive themes) the core buttons have the same behavior on desktop and mobile. However, you can set a CSS code to force a different behavior depending on the screen size.

    To do so, select the wrapper of the Button block and in the block options right sidebar, click on the settings tab (the cogwheel) and go to the bottom and type a name such as center-on-mobile?(for example) on its Additional CSS class(es) field.

    https://d.pr/i/d0oaVH

    After that, please add this code in your “Additional CSS” tab (at My Site > Appearance > Customize https://wordpress.com/customize), in a new line, under any existing code, and make sure you click on “Save Changes” to save it:

    @media(max-width:768px){
 .center-on-mobile{
  justify-content: center;   
 }
}

    You can adjust the max-width setting to smaller screens reducing the px width.

    I hope this solves your issue ??

    Thread Starter philraymond

    (@philraymond)

    That worked, thanks, but I had to add !important to override the inline style.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to make buttons centered only on mobile?’ is closed to new replies.