Mobile site picture formatting issues

Hello,

1. Currently, the Background Image is resized according to the size of the available area for the best fit. You may consider using a different image or background positions for responsive devices based on your requirements as it may work best in this case. Example:

[ch_pre type="css"].device-md .background-position-class { background-position: left center !important; }

.device-sm .background-position-class { background-position: center center !important; }

.device-xs .background-position-class { background-position: 30% 50% !important; }[/ch_pre]

Additionally, you can also consider using a different background-image CSS Property like url('image.jpg'), changing them for different devices as mentioned above.

This will definitely work fine. The Responsive Classes are as follows:

.device-xxl – Class for Larger Devices >=1400px

.device-xl – Class for Large Devices >=1200px to 1399px

.device-lg – Class for Medium Devices >=992px to 1199px

.device-md – Class for Tablets

.device-sm – Class for Landscape Mobiles or Phablets.

.device-xs – Class for Portrait Mobiles

1. Headers are not Sticky on Mobile by default but this can be turned on easily by adding the data-mobile-sticky="true" to the `` Tag. Consider reading the Documentations: https://docs.semicolonweb.com/docs/header/sticky-header/ .

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.