Viewing 18 posts - 1 through 18 (of 18 total)
  • Author
    Posts
  • November 7, 2019 at 7:07 pm #1154718
    hylandgraphics

    Hello,

    I am noticing the area above header on mobile not showing. It should be blue with white text like on the main site. Any ideas on how to remedy this? Thanks!

    November 8, 2019 at 2:25 am #1154794
    Jordan Shannon

    Hey hylandgraphics,

    Add this to quick css:

    @media only screen and (max-width: 767px)  {
#header_meta{
background:#14396c!important;
}}

    Best regards,
    Jordan Shannon

    November 8, 2019 at 6:04 pm #1155081
    hylandgraphics

    That did not seem to do the trick? Thoughts?

    November 8, 2019 at 9:40 pm #1155110
    Jordan Shannon

    Hi,

    Did you add the code to the very top of quick css so it runs first? Also, be sure to clear the cache a few times over.

    Best regards,
    Jordan Shannon

    November 8, 2019 at 11:57 pm #1155124
    hylandgraphics

    Yes to no avail? It is still not working and the only CSS I have right now. Cache is cleared on site and browser. Take a look if you would like.

    November 10, 2019 at 5:02 am #1155285
    Rikard

    Hi,

    Please see private for what I see on my end, is that correct or not?

    Best regards,
    Rikard

    November 11, 2019 at 5:50 pm #1155687
    hylandgraphics

    Yes but it is not showing up that way on my devices. I have cleared history and cache and tried multiple browsers. It is weird because the image in the header is incorrect on your screenshot as well. Below is a upload of what I am seeing. Thanks!

    November 12, 2019 at 12:13 am #1155777
    hylandgraphics

    I now see it is only not showing on the home page as on desktop I have the header hidden until scroll. Maybe this will help troubleshoot?

    November 12, 2019 at 6:01 am #1155825
    Rikard

    Hi,

    Thanks for the update, but I can’t reproduce what you are seeing in your screenshot. I’m still seeing what I posted previously. What exactly is wrong with the image in the header?

    Best regards,
    Rikard

    November 12, 2019 at 8:44 pm #1156138
    hylandgraphics

    The hero image/header image on the home page should be him at a desk. But I noticed on the small blue bar above the header only does not show on the home page (mobile only). As I said in the message above, this might be due to me using a transparent header on the desktop version that appears on scroll. I am still not seeing it on the home page (mobile) and the one you showed has the wrong picture so I am wondering if that is the mobile home page at all? I just need the area above header to show in blue with the text on the home page of the mobile site. Thanks

    November 12, 2019 at 8:46 pm #1156139
    hylandgraphics

    Can you just force a blue background on the area above the header on the home page. I can see it for an instant when scrolling back and forth. Thanks!

    November 13, 2019 at 8:31 am #1156301
    Rikard

    Hi,

    Sorry for the misunderstanding, the screenshot I posted was from a browser emulation. Please see private for what I’m seeing on an actual device (Android/Chrome).

    Best regards,
    Rikard

    November 14, 2019 at 5:55 pm #1156859
    hylandgraphics

    For some reason I am not seeing that on my iPhone as seen in the pic I posted above? Strange?

    November 14, 2019 at 6:43 pm #1156865
    Jordan Shannon

    Hi,

    I checked the screenshot. So you want that space removed completely? Text and all? The original css I sent was to make the background of that area blue so the text is visible.

    Best regards,
    Jordan Shannon

    November 14, 2019 at 6:52 pm #1156872
    hylandgraphics

    No I wan the blue with the white letters but it is not showing on the iPhone only on the home page?

    November 17, 2019 at 6:55 pm #1157672
    Mike

    Hi,
    Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

    @media only screen and (max-width: 1200px) { 
	#top #header_meta, #top #header_meta nav ul ul li, #top #header_meta nav ul ul a, #top #header_meta nav ul ul {
    background-color: #14396c !important; 
}
}

    After applying the css, Please clear your browser cache and check.

    Best regards,
    Mike

    November 18, 2019 at 5:26 pm #1157924
    hylandgraphics

    That did the trick!!!! Thank you!!!

    November 19, 2019 at 12:10 pm #1158113
    Mike

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    For your information, you can take a look at Enfold documentation here
    For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)

    Best regards,
    Mike

  • Author
    Posts
Viewing 18 posts - 1 through 18 (of 18 total)
  • The topic ‘Area above header on mobile not showing’ is closed to new replies.