-
Posts
-
Hi guys,
After the update to Enfold 3.0.8 I have a piece of whitespace on top of my homepage beneath the menu, on my Samsung Smartphone. It also gives a weird scroll effect.
You can see it here: http://www.screencast.com/t/5f3mRayyT3
Do you have a suggestion how I can fix this?
Sincerely,
MortickaHey Morticka!
Your site displays fine on an iPhone 4 using Chrome, what browser are you using and did you try to flush your cache and reload a few times?
Regards,
RikardHi Rikard :),
1. I used the standard Android browser. Flushing my cache did not solve the problem. I also asked a friend of mine with a Huwei Android phone to test it and he got the same results in the standard browser: http://www.screencast.com/t/FfwSaXlC
2. Even worse, in landscape mode in Chrome and on the standard browser on mobile the menu looks like this:
http://www.screencast.com/t/NjTXAHkjeFm
Can you help me?
Sincerely,
MortickaHey!
I checked your website on my iphone as well and this is how it looks on my end – http://i.imgur.com/Qua2OjC.png
I asked my teammates to check your website on their Android devices. Please kindly wait to hear from them Barb :)Best regards,
YigitHi Yigit :D,
Thx for checking it on your iphone in portrait mode. But, in landscape mode you see the same problem (problem 2 from #403438) as on the Android phones :(:
http://www.screencast.com/t/Cs4gpNkWk
I’ll be waiting for your Android teammates :)
Sincerely,
BarbHi guys,
I’m having both problems with my live website, my existing customers see both errors on mobile.
Is anybody looking at it?
Sincerely,
MortickaHi!
I am so sorry, apparently i forgot to notify my teammates. I did it now and checked your website on landscape mode. Please see screenshots here – http://imgur.com/a/WIADt
Cheers!
YigitHi Yigit,
I can’t see the header in your screenshot in landscape mode?
On the iphone it looks like this: http://www.screencast.com/t/Cs4gpNkWk
On the Samsung and Huwei Android phone it looks like this: http://www.screencast.com/t/NjTXAHkjeFmYou see the same problem.
And on the Samsung and Huwei phone Android phone it looks like this in landscape mode: http://www.screencast.com/t/FfwSaXlC
And as soon as you scroll down, the big image disappears.It’s been 7 days since I opened this ticket and I don’t know how to fix it. Can anybody help me?
Sincerely,
MortickaHey!
I checked on my android device with chrome and in portrait mode everything look fine. In landscape mode it looks like in your screenshot here: http://www.screencast.com/t/NjTXAHkjeFm, but you didn’t tell us what you want to change/achieve. I would need to guess now. Do you want to put the search icon on another place? maybe on the right side next to the menu? if yes use this:
@media only screen and (max-width: 989px) { #advanced_menu_toggle, #advanced_menu_hide { margin-top: -106px; right: 45px; } #top #menu-item-search { margin-top: -168px; bottom: -45px; }}Please always tell/show us exactly what you want to achieve.
Regards,
AndyHi Andy,
Oh I’m sorry, normally I explain everything in detail, but I thought it was obvious that the landscape header had to be the same as the portrait header. Logo on the left, search icon and menu aligned on the right. :)
1. I used your code and now the header in landscape mode looks like this: http://www.screencast.com/t/7rIBTNNRMl
The header is supposed to look like this: http://www.screencast.com/t/5f3mRayyT3 (without the white space underneath the header)2. That said, the white space and scroll issue shows up in the standard Android browser, not in the Chrome browser (see #403438) This issue shows up on two different Android phones.
My clients are not the sort of people who download Chrome for their mobile phone, so it is important that the white space and scroll issue is fixed as well.
Do you have another solution for the landscape and whitespace problem?
Sincerely,
MortickaHi!
your header behaves really weird. Maybe there is a conflict with a plugin. However remove my code from above and try this one:
@media only screen and (max-width: 989px) and (orientation: landscape) { #advanced_menu_toggle, #advanced_menu_hide { margin-top: -18px; right: 0; margin-right: -15px; }} @media only screen and (max-width: 989px) and (orientation: landscape) { #top #menu-item-search { margin-top: -168px; bottom: -93px; }}If that does not help, can you please give us admin access so we can take a deeper look into the issue? post login details here as private reply.
Cheers!
AndyHi!
instead of this:
@media only screen and (max-width: 989px) and (orientation: landscape) { #advanced_menu_toggle, #advanced_menu_hide { margin-right: -15px; }}use this code:
@media only screen and (max-width: 989px) and (orientation: landscape) { #advanced_menu_toggle, #advanced_menu_hide { margin-right: 10px; }}2.) I can’t really see any scroll issue. Can you show it using a screencast or explain exactly when it occurs? I also can’t see any errors in Chrome console. It seems fine for me.
However it sounds for me that Cloudflare and/or your caching plugin would cause this issue. Please switch them off, then clear your browser cache and refresh your site a few times. Make sure to have all plugins deactivated while doing this.Cheers!
AndyHey!
No, maybe I did not explain well enough. Please remove this:
@media only screen and (max-width: 989px) and (orientation: landscape) { #advanced_menu_toggle, #advanced_menu_hide { margin-right: -15px; }}and replace it with this:
@media only screen and (max-width: 989px) and (orientation: landscape) { #advanced_menu_toggle, #advanced_menu_hide { margin-right: 10px; }}So the only thing which will change is actually the margin-right value. However it seems you already did it, because on landscape mode your site and your menu looks good to me now.
2.) I checked your site with my htc one device and android standard browser and couldn’t find any issue. It looks like this for me:
I think my code from 1.) already changed this white space, so please clear your browser cache and refresh your page a few times. Hope this works for you now. If not let me know soon, so I will give a shout to my team mates, so they will check your site on their android device as well.
Best regards,
AndyHi Andy,
Nope, nothing worked. The white space is still there. Since it is a section with a background image set to parallax, I experimented with different settings.
In the following screenshot I set the background image to static. As you can see, I now have the same image twice. Where the white space used to be, there is now the same image only enlarged (look at the keyboard with the hand)
screenshot: http://www.screencast.com/t/K5xNqXFf5F0e
Then I changed the setting to scroll. As you can see now, the image is very large and you only see the hand with the keyboard. Yes, the whitespace is gone, but it is obvious that there is a conflict somewhere in the script and has nothing to do with CSS.
screenshot: http://www.screencast.com/t/hi5wmD1vJV
Please advice.
Sincerely,
MortickaHey!
did you clear your browser cache? because I can’t reproduce your issue anymore. It still looks like on my screenshot above for me: http://i.imgur.com/ybaHZQo.png
I will ask my teammates to check your website on their android device with android standard browser. Please kindly wait for their response.
Cheers!
AndyHi Andy,
Again, yes, I cleared my browser cache. Several times. Mobile, WP Rocket cache plugin, Cloudflare. Nothing helped.
I even cleaned up some leftover files via FTP in my WordPress root from plugins that I removed before.
The issue still exists and I don’t know what to do anymore?
Sincerely,
Morticka
- You must be logged in to reply to this topic.