What is the simplest way to add captions to images in 7.1 so they work in mobile?

Site URL: https://www.ojoveterinario.es/compartir-qr

In my site, ojoveterinario.es/compartir-qr, the qrs are below the texts as they are supposed to be. But when I check on mobile... they have been reversed! I have tried many CSS unsuccessfully.

Note: I would want something robust ie. CSS code. Adding images and line blocks might work to start with, but if I have to change anything again, it will again break.

13 hours ago, ojos said:

when I check on mobile... they have been reversed

Your mobile layout is controlled independently of the desktop layout.

Within the editor, choose the mobile layout (using the icons, top-right) and then drag the elements into the layout you require for mobile. Custom CSS is not required.

Did this help? Please give feedback by clicking an icon below  ⬇️

Add this code into custom css:

.content-wrapper {
  display: flex;
  flex-direction: column;
}

/* Mobile layout adjustment */
@media (max-width: 767px) {
  .content-wrapper {
    display: flex;
    flex-direction: column-reverse; /* Reverse the order for mobile */
  }
}