Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • January 13, 2017 at 7:00 pm #733290
    Gailson

    Hi,
    I write you because I have noticed in two diffent sites realized by me the same problems with transparent menu and now I really need a solution.
    When I choose transparent header on a page all goes right for the desktop version but enfold seems to have some problems on mobile version of this gorgeous header.
    On mobile the transparent header become white and that’s right for me! The problem is that if I chose white color for the menu of the transparent header on mobile I have white header with white menu so I can’t see menu list, social icons, secondary menu, phone number and any other text on the header.
    How I can solve it? Please help me quickly

    January 14, 2017 at 12:04 am #733379
    Basilis

    Hey Gailson!

    Can you please share us your web site?

    Thank you very much

    Best regards,
    Basilis

    January 14, 2017 at 5:01 pm #733580
    Gailson

    ok
    The site is:
    http://www.skin2skincongress.com

    and exactly on the page that i have putted on the Private content (is still a WIP page)

    you can find the same problem on another site realized on 2015:

    http://www.gastronomialucullo.eu

    the problem seams to be the fact that I don’t have an Enfold option to set a different text color on the header area when i see a transparent header on a mobile device (infact in that case the transparent header seams to be automatically deactivated)…

    January 17, 2017 at 5:25 pm #734832
    Gailson

    Help!!!

    January 17, 2017 at 6:05 pm #734878
    Andy

    Hi,

    try this code inside Quick CSS field:

    #top #wrap_all .header_color.av_header_transparency, #top #wrap_all .header_color.av_header_transparency .phone-info.with_nav span, #top #header.header_color.av_header_transparency .av-main-nav > li > a .avia-menu-text, #top #header.header_color.av_header_transparency .av-main-nav > li > a .avia-menu-subtext {
color: #000000;
}

    Best regards,
    Andy

    January 18, 2017 at 2:48 am #735080
    Gailson

    HI!
    This code make my Transparent header text always black but wot i need is the possibility to set a different Transparent header text between Desktop view and mobile view.

    Thanks in advantage

    January 18, 2017 at 11:06 pm #735592
    Andy

    Hi,

    then add media queries to my code, so it works on smaller screen sizes only. Something like:

    @media only screen 
  and (min-width: 414px) 
  and (max-width: 736px) {
#top #wrap_all .header_color.av_header_transparency, #top #wrap_all .header_color.av_header_transparency .phone-info.with_nav span, #top #header.header_color.av_header_transparency .av-main-nav > li > a .avia-menu-text, #top #header.header_color.av_header_transparency .av-main-nav > li > a .avia-menu-subtext {
color: green;
}}

    Adjust as needed.

    Fore more information about media queries refer to: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

    Best regards,
    Andy

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.