Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1149349

    Hi,
    I added the followining code to get the custom standard font and bold version on hover/active.
    All good so far EXCEPT that the menu items seem to “jump” when you hover over them meaning that they are not static. The bold font on hover seems not to work in this way? Maybe it would be a solution to define absolute positions for the menu items?
    What can I do?

    Thanks
    Carolin

    #top #header .avia-menu-text {
    font-family: Gilroy-Regular;
    font-size:20px;
    letter-spacing: 2px;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    }

    #top #header #avia-menu li.menu-item:hover > a > .avia-menu-text {
    font-family: Gilroy-Bold;
    font-size: 20px;
    letter-spacing: 2px;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    }

    #1149396

    Hey Carolin,

    If the text size changes in any way or the text becomes bold there will always be the jumping effect. You should not change those, just colors or background.

    Best regards,
    Victoria

    #1149763

    Hi Victoria,
    isn’t it maybe possible to give an absolute position to each menu item to avoid this behaviour?
    It looks really unprofessional on a website..

    Thanks
    Carolin

    #1149794

    Hi Carolin,

    NO, it will break menu positioning and will not help the jumping issue. Don’t change the font on hover, change the color or background.

    Best regards,
    Victoria

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