Archived topic
Mobile Buttons Displaying Text on Multiple Lines
1 reply · Started by Chris on March 2, 2022
Hi, I am not very tech savvy. But I have a site I am building with GeneratePress and everything looks great going between Desktop and Mobile except that a button on my homepage displays in 3 rows with the words broken up. For example "Get a Quote" button in Desktop turns to "Get / A / QUO / TE" on 4 lines.
I cannot find any options in customization that seems to fix this! Thanks!
Hi Chris,
This is a WordPress core block and it seems that you’ve set this button to 25% width.
See: https://share.getcloudapp.com/QwuLqRn0
Also see: https://share.getcloudapp.com/YEurgmwR
This is the reason why the issue occurs. What you can do is remove the width set in its Block settings so it just occupies the necessary space.
See: https://share.getcloudapp.com/YEurgmy4
Then, we can use custom code to add padding if you prefer.
Or, better yet, if you have the free GenerateBlocks plugin, you may use a Buttons block instead: https://share.getcloudapp.com/9Zuml2KJ
Through this Block, you may set spacing settings on different views: https://share.getcloudapp.com/nOuRdwLp
You may refer to this doc for more information regarding this: https://docs.generateblocks.com/article/buttons-overview/
Hope this helps! Feel free to reach out if you’ll need further assistance. :)
