Changing Layout Just On Mobile View
Marketing
Good Afternoon,
The main section of all our standard website pages follow same format and content is located in 2 columns. In the first row there is an image in the left hand column and text in the right hand column. This then alternates in the next row so the text is on the left and image on the right and so on. When you switch to the mobile optimised version the content then all moves into one column in the order that it is displayed on the page, meaning that the images end up following on from each other (text, image, image, text) when we would like the format to be image, text, image, text. Is there any way to do change this on the mobile optimised site without changing the layout on desktop view?
A good page to look at as an example is: https://www.cloudconnx.net/stage4/solutions/connectivity/mobile For this page on mobile view we would like the 'Technology behind mobile broadband' text block to be above the image of the mast.
Many thanks
Ariba
Accepted AnswerHello
Thank you for your query.
First provide a section id or class to the section - where you want to reverse text<>image position. Then use the following css rule in custom css section and change the "#custom-section" with your custom section id/class.
@media (max-width: 767px) {
#custom-section .sppb-row {
flex-direction: column-reverse;
}
}