View on Mobile is Appearing Squished

Support
#1

I am using the X theme, view on mobiles is like the picture shown.

I want it like this.

The editor didn’t allow me to post 2 images even though I am a user for more than 4 years.

Please guide me on what code I can add so that I can get the view as I want it.

My website: Alkalinedietindia.com/adp (the page of screenshot)
Ref Website: jamesclear.com

Thank you

#2

Howdy, @tristam15!

Thanks for writing in. Because of the way that the headers are setup in X, we encourage user’s not to modify them in any way as they have some highly specialized markup and styling to get the layout that they have. Any customizations made to headers must be implemented by users due to the complex nature of getting in a particular look, which is generally beyond the scope of support offered.

As another point to consider, if you find that you need more out of the box control over your headers but without wanting to delve into the code, our theme “Pro” which is aimed at advanced users allows for you to truly build out any header that you wish to have. You can learn more about Pro here:

As well as its included “Design Cloud,” which are free premium assets mostly developed in-house, but we’ve recently added some that were contributed to by our community:

#3

Hi,

My question is not about headers at all.

I was asking about the text being centered and space being left over on the sides when in mobile view.

I showed a comparison of the same in the images. I am not referring to headers.

#4

Hi There,

Please try adding this custom CSS under Theme Options > CSS:

@media (max-width: 480px){
    .entry-wrap {
        padding: 10px;
    }
}

Hope it helps :slight_smile:

#5

Hi,

I can’t find Theme Options > CSS

I can find under customizer only 2 things.

Custom > Global CSS

Additional CSS>

Which of these should I add it to?

#6

Hi there,

I have checked your site and your X version is still 4.6.4 and this version does not have the Theme Options feature. If you want to add the custom CSS, you can do it in the customizer that you have mentioned,

Also, please note that the compatible Cornerstone version of X 4.6.4 is Cornerstone 1.3.3.

Currently, the Cornerstone version on your site is 3.0.4 which is a newer version. Please note that this might cause a compatibility issue since your X version is outdated which Cornerstone is updated.

You may keep you X and Cornerstone both updated in order to avoid issues.

Please take a look our changelog for the update information:

https://theme.co/changelog/

Hope this helps.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.