Docs

[mikewoj]

Hi

I have a header image which is not responsive on mobile devices. It is far too zoomed on when you visit the site on a mobile phone.

I tried following the instructions of the following post but it did not work for me.
https://community.theme.co/forums/topic/header-image-not-resizing-or-responsive-for-mobile-phone-and-tablet/

Any idea how I can fix this issue?

The site is:
http://temp.donnapartow.com/

Thank you so much 🙂

[Baroninn]

Hi

I think the reason your image is not responsive is because you have padding: 440px 0px 65px; in your element style

If you remove that , you will see your image to be 100% responsive 🙂

But I know what your next thought is : “Why is my image only showing part of it”
Well , its because you have it set as background
Try using the Image element 🙂 Thats 100% responsive
And you can have it full-width 🙂

If you really need it to be a background , then go where the padding: 440px 0px 65px;
and change it to : padding: 28% 0px 65px;
That should make it responsive

You can also use the GAP element and set it to 28%

Hope this helps 🙂

[Joao]

Hi There,

You can try following the advice above, Thanks @Baroninn.

I always set my padding and gap sizes on % instead of px it responds much better on mobile.

Let us know if you need further help,

Thanks

Joao

[mikewoj]

Ok great, thanks for your help. I have done that it is works on a mobile phone.

How do I make the image element full screen? Do I have to enter in a class or something?

Thanks again!

[Baroninn]

To make the image element full screen you can do the following :

In ROW : Toggle “Column container -> Off” and toggle “Marginless columns -> On”

In Section : set Top & Bottom padding to -> 0px

Below you can see image guide to this 🙂
Hope this helps

First step

Second step

Third step

Best regards

[Baroninn]

One more thing , if you want to dig a little deeper.

Its good to think of cornerstone layout as block’s , “built on top of each other.”

Section -> Row -> Columns -> Element(image or text element for example)

Detail description :
So.. when you place an image in cornerstone you will find that under the image is a column, and under the column is a row, and under the row is a section.

Please study that structure, because once you figure that out , you will find that your life will get easier, and that cornerstone has much more potential than you originally thought.
Its pretty simple actually.

There are some settings you will find in section that you cannot find in column, and vice versa.
For example :
In Section you can hide the section based on screen width, but you cannot in column settings.
In column settings you can “Enable fade effect” , but you cannot in section.

So,,,, to sum up :
Study all the settings in section,,, then study all the settings in Row,,, then study all the settings in columns
Test them all out, make mistakes and learn from them 🙂

Theme.co says that X-theme is the last theme you’ll ever need
And its true. I have never used any other theme since I started working with it, because it has such a great variety of settings for all parts… And when they dont have any kind of settings for it , you should be able to search their forum for a solution , because soooo many users are using x-theme and cornerstone, and if you are experiencing some issues im sure that someone has also, and has posted an answer to it on their support forum.

So, in simple terms : Read all their Knowledge base : https://community.theme.co/kb/
to see it’s full potential.

Hope this helps 🙂
Oh, the reason why im contributing to this support forum is because they have one of the best support forums on the planet.
Every time I hit a wall and ask a quetion here , they answer within 24hours, and if its related to their product, they will figure it out fast.

So , they scratch my back , I will most certainly scratch their’s 🙂

Best regards.

[Joao]

@Baroninn

Thanks so much for the help and kind words it really bring us all a smile to our faces.

@mikewoj let us know if you need further help.

Thanks

Joao

[mikewoj]

Thanks so much @Baroninn!!! Huge help and it worked great 🙂

And I must agree, the support has been fantastic!

[Rad]

Glad to hear that! 😉

[Author]

Posts