Image frame issues mobile

Hi,

I have a problem with picture framing on mobile devices. A set up a custom call to action bar using site builder. I added a row with the columns using site origin picture widget on all three columns. I uploaded three images with the size 500x400 px and added a frame. When holding the iphone upright everthing is fine. When holding it tranverse, picture and frame seperate:

https://lsvdummy.lima-city.de/

With the iPad its the other way around. Tranvers is fine, upright seperated.

Do I have to upload another image size? Is there anything else i can do?

Cheers,

Michail

Hello Michail,

To fix it, you can add the following CSS code into your site’s additional CSS option which resides under the Appearance > Customize > Additional CSS.


@media only screen and (max-width:780px) {
  
  #pg-241-0 .panel-widget-style {
    width: 498px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  
}

I hope this reply helps.

Regards,
Kharis

Yes, that helped, topic is resolved, many thanks!

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis