At the end of each of my pages, I created buttons allowing visitors to access the other pages of the site.
To do that, I created a line of 5 columns with WPBackery, and I created a button in each column. These buttons have a cut-out style, with a photo in the background, a text, and a URL to point to. They fill the full width of the columns.
The result suits me perfectly for a 1920px computer screen width where all buttons are side-by-side, and for a smartphone screen width where the buttons are one below the other.
However, depending on the resolution of the tablet screens, it happens that the text of the buttons is split on a second line; and even sometimes all the letters are vertical ... which is not very beautiful!
I have attached screen prints; you will see the problem on images 2 and 3.Is it possible to have the buttons below each other (like picture 4) as soon as the width of a button becomes too small for the length of its text?
Thanks in advance,
Attached files: 1-good.jpg 2-not_good.jpg 3-not_good.jpg 4-good.jpg
That needs some custom coding to force them to break the columns at certain sizes.
Please provide me with a temporary admin account and I'll try to do that.
owwwlab's Developer Team representee
Please test and see if there is any issue with it now.
Thank you very much, it's (almost) perfect!
It works very well for all portfolios, but there is still the problem on the presentation page: http://loreedesnuits.fr/presentation/
If you want to remodify your Additional CSS, it's the one that starts at line 49.
I forgot to join the screen print ...
Attached files: presentation_page.jpg
You just need to go to that page or portfolio from the admin panel. Click on edit icon for the corresponding row element to open the "Row Settings" and for the "Extra class" field at the bottom of settings add this "buttons-row".
thank you so much