My home page has 3 columns of text, each leading to its own button.
I placed the buttons on a new row so that they would align with each other.
However, on a mobile device, the text in column 1 does not lead to the button in column 1.
As I scroll down I see, in this order: text column 1, text column 2, text column 3, button column 1, button column 2, button column 3.
How can I align the buttons horizontally beneath the text columns which have different lengths, in a way that on a mobile device, text column 1 is followed by button 1?
This is an expected responsive result, unfortunately. One solution would be to make use of the Layout Builder widget which would let you put everything in one row. The Layout Builder widget is essentially a Page Builder layout in the form of a widget. It would take some work but should hopefully produce the result you’re after.
Not necessarily relevant to this question but it’s worth noting that when editing a row (click wrench icon far right) that under the Layout tab you can set the collapse order for mobile. That might come in handy in another situation.