Background on mobile - Support | Kriesi.at

Viewing 19 posts - 1 through 19 (of 19 total)

Author

Posts
February 13, 2022 at 7:46 pm #1340401

tammiviestinta
Participant

Hi,
I’ve used church demo on one site. There is minus margin to lift column and text to another section. It has worked fine earlier , but now it works only on large screens, not on mobile. How could I fix it?

On large screens it’s ok:
https://kotikirkko.fi/wp/wp-content/uploads/2022/02/on-large-screens.jpg

On mobile not ok:
https://kotikirkko.fi/wp/wp-content/uploads/2022/02/on-mobile.jpg

February 14, 2022 at 5:31 am #1340435

Rikard
Keymaster

Hey tammiviestinta,

Thanks for the screenshots. I checked the front page, but it seems to be working as it should there. Could you post directly to the page where the screenshots are taken from please?

Best regards,
Rikard

February 14, 2022 at 9:43 am #1340450

tammiviestinta
Participant

Here are some links.

February 14, 2022 at 4:56 pm #1340536

Ismael
Moderator

Hi,

Thank you for the info.

It seems to be working correctly on our end now as shown in the screenshot below. Have you managed to find the cause of the issue? It might be a z-index issue based on the screenshots above. Increasing the stack order or the z-index property of the second section should fix the issue.

Best regards,
Ismael

February 14, 2022 at 4:57 pm #1340537

tammiviestinta
Participant

I have not managed to fix it. The problem is only on small screens.

February 14, 2022 at 5:25 pm #1340547

tammiviestinta
Participant

Same problem also on these pages:

February 14, 2022 at 10:42 pm #1340595

tammiviestinta
Participant

And here:

February 15, 2022 at 11:04 am #1340669

tammiviestinta
Participant

“It seems to be working correctly on our end now as shown in the screenshot below. Have you managed to find the cause of the issue? It might be a z-index issue based on the screenshots above. Increasing the stack order or the z-index property of the second section should fix the issue.”

I’m not good at coding. Could you please tell me exactly what I need to do. Thanks for your help again!

February 15, 2022 at 1:39 pm #1340695
Ismael
Moderator
Hi,

Thank you for the inquiry.

You have to adjust the z-index of the second color section containing the column with the margin offset. Please add this css code first and let us know if it changes anything.
```
#av_section_2 {
    z-index: 9999;
    position: relative;
}
```
You may need to toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css.

Best regards,
Ismael
February 15, 2022 at 3:14 pm #1340730

tammiviestinta
Participant

Unfortunately this did not help.

February 17, 2022 at 5:49 pm #1341210

Yigit
Keymaster

Hi,

Could you please create temporary admin logins for one of the websites and post them here privately so we can look into it? :)

Best regards,
Yigit

February 18, 2022 at 1:17 pm #1341341

tammiviestinta
Participant

It looks like there is no background color on small screens.
Here are temporary admin logins for one site:

February 21, 2022 at 5:06 am #1341571

Ismael
Moderator

Hi,

Thank you for the info.

The “kotikirkko” site is not loading properly on our end. Is it down? The issue seems to be resolved on the other site as shown in the screenshot below. (see private field)

Best regards,
Ismael

February 21, 2022 at 2:42 pm #1341657

tammiviestinta
Participant

The site “kotikirkko” is working normally.

These backgrounds are working, if you try it by draging browser window smaller, but not on iPhone or on Android phone.

I now tried to bring the first color section on the page again, and it helped. So I’ll do this to all these pages. It takes some time, but is the easiest way to solve this, I think.

February 22, 2022 at 4:18 am #1341741
Ismael
Moderator
Hi,

Did you toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css code that we suggested above? The css code should put the second section above the first section and prevent that first section from covering the columns with the margin offset.

You may need to apply a unique class name or ID to the color section containing the columns with the offset and use that instead of the generic ID that is automatically applied to the color section elements.

Example:
```
.av-custom-section-offset {
    z-index: 9999;
    position: relative;
}
```
Edit the color section, go to the Advanced > Developer Settings section and place the name “av-custom-section-offset” in the Custom CSS Class field.

Best regards,
Ismael
February 24, 2022 at 10:25 am #1342130

tammiviestinta
Participant

I tried to disable that and everything went wrong. I had to update backup copy.
But I can handle this: I just make those pages again.

But what could I do for that problem: on Chrome browser fullwidth easy slider caption is just like its hould be (white and right size) but on Edge or Firefox it is red and too small?

February 25, 2022 at 4:20 am #1342212

Ismael
Moderator

Hi,

Alright. If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

Thanks!

Best regards,
Ismael

February 25, 2022 at 10:44 am #1342252

tammiviestinta
Participant

Ok, thanks.

February 25, 2022 at 3:51 pm #1342286

Rikard
Keymaster

Hi,

Thanks for the update, I’ll go ahead and close this thread for now then. Please open a new thread if you should have any further questions or problems.

Best regards,
Rikard
Author

Posts

Viewing 19 posts - 1 through 19 (of 19 total)

The topic ‘Background on mobile’ is closed to new replies.