Tagged: , ,

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • February 22, 2014 at 5:52 am #227827
    sandromeyer

    Hi there,

    On my website:
    http://flatev.com.s180084.gridserver.com/

    I got some issues with the header. I’d like the header to always be a certain height and turn off the scaling entirely. It should still be fixed when scrolling however.

    Also how would I make it completely transparent instead of white background? In the styling panel I can only choose colors.

    Thanks a bunch for your help.

    cheers,
    Sandro

    February 23, 2014 at 2:55 am #228016
    Ismael

    Hi sandromeyer!

    I can’t seem to access the website. What type of header do you have right now? Assuming that you have a Small Fixed Header, you can add this on Quick CSS to create a transparent header: 

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

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

.header_color div {
border: none;
}

    Edit js > avia.js to remove the header resize, find this code on line 21:

    // decreases header size when user scrolls down
        avia_header_size();

    Replace it with:

    // decreases header size when user scrolls down
        //avia_header_size();

    For further customization, please visit Werkpress.

    Cheers!
    Ismael

    February 24, 2014 at 7:27 pm #228631
    sandromeyer

    Thank you for your answer Ismael.
    Here you can see our website:
    http://flatev.com.s180084.gridserver.com/

    Your suggestions work perfectly. One further question however:

    – How do I control the height of the top menu? It is too high right now!

    thank you so much,
    Sandro

    February 24, 2014 at 7:32 pm #228635
    Josue

    Hey Sandro!

    Use this code:

    
#header_main .container, .main_menu ul:first-child > li > a {
height: 80px  !important;
line-height: 80px  !important;
}

html.fixed_header #main {
padding-top: 80px;
}

    Cheers!
    Josue

    February 24, 2014 at 7:37 pm #228638
    sandromeyer

    Doesn’t change anything if I put into the Custom.css (enfold –> styling options)
    The CSS file already contains:

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

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

.header_color div {
border: none;
}

    What am I doing wrong?

    February 24, 2014 at 7:58 pm #228643
    Josue

    Hey!

    I see it here:
    http://flatev.com.s180084.gridserver.com/wp-content/themes/enfold/css/custom.css?ver=1

    But is set to 130px, try changing it to 80px.

    Best regards,
    Josue

    February 24, 2014 at 11:12 pm #228714
    sandromeyer

    perfect thank you. We are getting closer =)

    now how can I increase the padding on the bottom of the logo?

    February 25, 2014 at 4:30 am #228813
    Josue

    There is no actual padding below the logo, one thing you can do is reduce the logo size or increase the menu height (with the code i provided earlier).

    You could also try pushing the logo top:

    .logo img {
    position: relative;
    top: -5px;
}

    Cheers!
    Josue

    February 25, 2014 at 4:30 am #228814
    Josue

    There is no actual padding below the logo, one thing you can do is reduce the logo size or increase the menu height (with the code i provided earlier).

    You could also try pushing the logo top:

    .logo img {
    position: relative;
    top: -5px;
}

    Cheers!
    Josue

    February 26, 2014 at 2:01 am #229320
    sandromeyer

    worked. thank you!

    February 26, 2014 at 2:03 am #229326
    Josue

    You are welcome, glad we could help :)

    Regards,
    
Josue

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