Search code examples
cssscale

how can i get slower animaton in css scale?

I wrote this code for animate my menu

   .main-navigation a:hover{
        transform: scale(1.1)!important;

but I want slower animation with time or anything else

Solution

  • This should work:

    .main-navigation a {
    transition: transform 250ms;
    transform-origin: center center;
}
.main-navigation a:hover{
    transform: scale(1.1) !important;
}

    A friendly advice: try to setup your CSS so you don't ever have to use !important.