Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • March 6, 2014 at 2:14 pm #233177
    envapk2

    Hi
    I am trying to get the header transparent and have tried various stuff from the forums with mixed results. Currently this works fine for desktop:

    .header_color .header_bg{
    background: transparent !important;
    }
    .main_menu li:hover {
    background: transparent !important;
    }
    .content {
    padding-top: 138px;
    padding-bottom: 1px;
    }
    .fixed_header #main {
    padding-top: 0;
    }
    .header_color div {
    border: none;
    }

    But on mobiles it doesn’t make it transparent and just pushes the content down too far.
    Can I add some responsive CSS or is there a better way altogether?

    March 7, 2014 at 4:57 pm #233835
    Ismael

    Hi envapk2!

    Thank you for using the theme. I hope you’re doing great.

    What type of header do you have? Maybe, you can add this below the code to prevent the “content push” on mobile device:

    @media only screen and (min-width: 768px) {
.content {
padding-top: 0px;
padding-bottom: 1px;
}
}

    This can make the Small Fixed Header transparent:

    .fixed_header #main {
padding-top: 0;
}

.header_color .header_bg, #header_main {
background-color: transparent !important;
border: none;
}

.header_color div {
border: none;
}

    Cheers!
    Ismael

    March 7, 2014 at 5:28 pm #233862
    envapk2

    Hi Ismael

    I’m using a Small Fixed Header. I tried putting the @media bit in but it just pushed the content on the desktop version up and didn’t affect the mobile version at all.

    Peter

    March 10, 2014 at 7:07 pm #234890
    Yigit

    Hi!

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 989px) { 
.responsive #top #main {
margin-top: -88px;
}}

    If that does not work, please post the link to your website

    Best regards,
    Yigit

    March 10, 2014 at 8:01 pm #234936
    envapk2

    Hi Yigit

    That works, thanks so much.
    It would be great if the transparent header was incorporated into theme options in any future updates. But anyway, this is just a superb theme, the best I have come across so far.

    Peter

    March 10, 2014 at 8:05 pm #234941
    Yigit

    Hey!

    You can request such feature here https://kriesi.at/support/topic/enfold-feature-requests/
    Glad we could help! Let us know if you have any other questions or issues

    Cheers!
    Yigit

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘header transparency – mobiles’ is closed to new replies.