[soleystefansParticipant]

Dear support,

I have two questions I am hoping you can help me with.

1.
It seems the sections where I use background images are not responsive and do not scale for mobile.

Here is my site: http://mariaellingsen.is/

So if you look at the front page and scroll down, the background images do not scale, not the one in the first section, third section and in the 4th section where I use featured list the text and the white column background colour is not even responsive.

The same for this page, the big images do not scale for mobile: http://mariaellingsen.is/kennari/ and this: http://mariaellingsen.is/um/

2.
I am using padding on the front page to make the quotes look better on desktop – but that makes them to narrow on mobile. Can I design it differently on mobile?

many thanks
Soley

[soleystefansParticipant]

This reply has been marked as private.

[FriechModerator]

Hi There,

Thanks for writing in! #2 you can add this under Custom > CSS in the Customizer.

@media (max-width:  767px) {
	.mobile-padding {padding: 0 !important;}
}

Then apply a class mobile-padding on the columns where your quotes is and this should remove its padding when viewed on mobile.

#1 Please follow this posts on how background image works.

– https://community.theme.co/forums/topic/background-image-not-responsive-2/?replyto=628487#post-628693

– https://community.theme.co/forums/topic/background-image-on-phone/#post-780991

Hope it helps, Cheers!

[soleystefansParticipant]

Great! thank you very much – I have solved all but one thing.

On the front page section 5, where I am using Feature list in Cornerstone, the text of the Feature list goes out of the column it is in, and it looks bad because the column has white background color (so the text is better readable on the image)

Can you help me to understand why the Feature list text goes out of the column?

many thanks

[ChristopherModerator]

Hi there,

I’m not able to replicate this. Please clear cache, check again and confirm me or provide us with some screen shots.

Thanks.

[soleystefansParticipant]

Hi,
here is a screen shot and I have also cleared cache.
the text goes out of the white box (the column with white a bit transparent background color). I would like the text to be on the white color and it would be great if the white could be centered on the screen (that is with even space on the left and right.

[JoaoModerator]

Hi There,

Please add the following code to Appearance > Custmoizer > Custom > CSS

@media (max-width: 480px) {
.home #x-section-5 .x-container {
padding-right: 0px;
} }

Hope it helps

Joao

[soleystefansParticipant]

thank you.

unfortunately it did not work. I am wandering if the code has to make the white column without padding?

[JadeModerator]

Hi Soley,

Please try this:

@media (max-width: 480px) {
     .x-feature-box-title {
         font-size: 1.15em;
     }

     .x-feature-box-text {
         font-size: 0.8em;
     }
}

Hope this helps.

[Author]

Posts