Tagged: sticky header
-
AuthorPosts
-
March 26, 2018 at 7:37 pm #933161
I previously posted for help on this topic about my sticky header covering my layer slider and how to move it down here:
https://kriesi.at/support/topic/mobile-sticky-header-hiding-content/
which solved the problem on mobile but not on tablet for me.I added this code for mobile which worked:
@media only screen and (max-width: 480px) {
.html_header_top.html_header_topbar_active.html_header_sticky #top #main {
padding-top: 109px!important;
}}How can I move the content down for tablet view as well?
March 27, 2018 at 5:06 am #933345Hey amerzib,
Try using this code:
@media only screen and (min-width: 767px) and (max-width: 1024px) { .html_header_top.html_header_topbar_active.html_header_sticky #top #main { padding-top: 109px!important; } }
If it does not help, please post the link to your website.
Best regards,
VictoriaMarch 27, 2018 at 4:41 pm #933735Thanks I tried the code but it didnt work.
Sorry I forgot to post the link too.
Its bestdoorsinc.caThanks
March 27, 2018 at 10:07 pm #933899Hi,
The site looks good on my end. You may not see the changes until the cached files are cleared in your browser.
Please try to hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload” and review the site again.
If you still have any issue please upload a screenshot/mockup to imgur.com and share the link here so we can help you better :)
Best regards,
VinayApril 9, 2018 at 2:17 pm #939228Im looking at my site on mobile, dont know how to clear cache on an ipad or iphone but it still looks wrong.
Looks like this: https://ibb.co/d8SsXHApril 10, 2018 at 7:25 am #939631Hi amerzib,
Here is how to clear cache on an iPad
https://www.macworld.co.uk/how-to/iphone/clear-cache-iphone-3609079/Can you please post the link again? I get 403 on the links in the original thread.
If you need further assistance please let us know.
Best regards,
Victoria- This reply was modified 6 years, 7 months ago by Victoria.
April 10, 2018 at 3:42 pm #939908Thanks, I cleared the cache on iPad but I am still getting the same thing as seen here: https://ibb.co/d8SsXH
April 12, 2018 at 4:13 am #940742Hi,
I can’t reproduce the issue on my end. What is the actual version or model of your iPad device?
Screenshot: https://imgur.com/a/I2Q4p
Best regards,
IsmaelApril 12, 2018 at 3:51 pm #941016I actually took that screen shot on my iphone 6 plus when I turned the phone to be horizontal, its not happening on the ipad anymore.
It looks fine in vertical format on the iphone too.April 13, 2018 at 6:35 am #941279Hi,
Thanks for the feedback, so it’s working as it should now? Please let us know if you should need any further help on the topic.
Best regards,
RikardApril 13, 2018 at 6:23 pm #941633Its still not working on my iphone when in landscape mode.
You can see the screen shot in my post above. ThanksApril 16, 2018 at 7:07 am #942440Hi,
The previous css media query targets tablet devices. Please replace it with this code.
@media only screen and (min-width: 375px) and (max-width: 1024px) { .html_header_top.html_header_topbar_active.html_header_sticky #top #main { padding-top: 109px!important; } }
Adjust the values as needed.
Best regards,
IsmaelApril 18, 2018 at 12:15 am #943310That worked perfectly! Thanks!
April 18, 2018 at 1:13 pm #943577Hi,
Great, glad you got it working. Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
RikardApril 18, 2018 at 1:39 pm #943593you can close it thanks!
April 19, 2018 at 1:21 am #943820Hi,
Glad that it’s all good. Please feel free to come back if you need further assistance.
Thanks for using Enfold and have a great day :)
Best regards,
Nikko -
AuthorPosts
- The topic ‘Mobile Sticky Header Hiding Content’ is closed to new replies.