Mobile Pages Not Formatting Correctly

[Craig]

Hi

I am having a mobile page formatting issue. Most pages look fine on mobile, but a few will not stretch to the full width of the mobile device.

Any idea how to fix this problem?

Example
https://synergywellnessnc.com/contact-us

Thanks

[Sonnal S Sinha]

Hi,

Your 1 year support for theme has expired. To continue receiving theme updates/access and support for another year kindly subscribe for just $18

Pay via PayPal:

https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=E6MFAFM4T6RDL

OR

Pay via Credit Card:

https://sites.fastspring.com/sktthemes/product/singlethemeyearly

Once paid we will again renew your support for 1 year and you will also receive theme updates/access as and when they happen.

Regards,
Chris

[Craig]

I paid the support fee.

[Sonnal S Sinha]

Hi,

Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

Add this code there:

.entry-content iframe, #cpm_sROrFI { width: 100% !important;}

Regards,
Chris

[Craig]

Thanks for the response…

I added the code to the CSS and cleared the cache in my mobile device, and the pages are still not rendering correctly. When the page first loads it looks correct (full width, but then it get skinny.

[Craig]

Screenshot on mobile
https://www.screencast.com/t/7BfBzLSsxVe

Not all pages are doing it. And some pages are skinnier than others. I have never seen this before.

[Sonnal S Sinha]

Hi,

Kindly use this one

@media screen and (max-width:767px) {
.entry-content .cpm-map {
    width: 100% !important;
}
}

Regards,
Chris

[Craig]

Thanks. That did fix the Contact Us page but not the others.
https://synergywellnessnc.com/book-appointment/
https://synergywellnessnc.com/video-library/

[Sonnal S Sinha]

Hi,

Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

Add this code there:

@media screen and (max-width:767px) {
.hours-and-scheduling.table, .entry-content iframe { width:100% !important;}
}

Regards,
Chris

[Craig]

That worked. Thank you.
One more thing… On mobile, I have this large white space from under the page header image and the page title. How would I reduce this space?

[Sonnal S Sinha]

Hi,

Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

Add this code there:

@media screen and (max-width:479px) {
.innerbanner { height:155px;}
}

Regards,
Chris

[Author]

Posts