Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • February 12, 2015 at 5:11 pm #395149
    alex5252

    I would like to reduce the font size of my menu on scroll so it still fits within the header. Right now it overlaps, how do I do that? My site is: http://perduemarine.com/

    February 12, 2015 at 5:18 pm #395156
    Yigit

    Hi alex5252!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    .header-scrolled .av-main-nav > li > a {
font-size: 15px!important;
}

    Best regards,
    Yigit

    February 12, 2015 at 5:20 pm #395160
    alex5252

    Thanks! Is there anyway to make it a smoother transition rather than just a rapid jump from big to small?

    February 12, 2015 at 5:29 pm #395168
    Yigit

    Hey!

    Please change the code to following one

    .header-scrolled .av-main-nav > li > a {
font-size: 15px!important;
transition: font-size .3s ease-in-out;
-webkit-transition: font-size .3s ease-in-out;
-moz-transition: font-size .3s ease-in-out;
-o-transition: font-size .3s ease-in-out;
}
#top #header .av-main-nav > li > a {
font-size: 30px;
transition: font-size .3s ease-in-out;
-webkit-transition: font-size .3s ease-in-out;
-moz-transition: font-size .3s ease-in-out;
-o-transition: font-size .3s ease-in-out;
}

    Best regards,
    Yigit

    February 12, 2015 at 5:30 pm #395169
    alex5252

    PERFECT! Thanks!

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Make menu shrink with header on scroll’ is closed to new replies.