Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • June 6, 2022 at 7:57 pm #1354329
    tiffanytnttobol

    Hi! I need to add a custom hover effect on a column and am using the following css

    .service:hover {
  background-color: white; padding: 2px; border-radius: 1px; border-color: #00afef !important;
}

    With this code the white background appears on hover but no border.

    June 6, 2022 at 8:02 pm #1354331
    tiffanytnttobol

    Nevermind, I got it:

    .service:hover {
 background-color: white; padding: 2px; border-width: 3px;
	border-style: solid; border-color: #00afef !important;
}
    June 6, 2022 at 9:00 pm #1354337
    tiffanytnttobol

    Another question – is there a way for the hover effect not to cause the content and icon to jump down a few pixels? I would like the hover effect to be static.

    June 7, 2022 at 4:59 am #1354349
    Nikko

    Hi tiffanytnttobol,

    Try adding this CSS code just above the code you posted:

    .service {
    border: 3px solid transparent !important;
}

    Hope this helps.

    Best regards,
    Nikko

    June 7, 2022 at 10:01 pm #1354447
    tiffanytnttobol

    That worked perfect, thank you so much!

    June 8, 2022 at 4:02 am #1354464
    Nikko

    Hi tiffanytnttobol,

    We’re glad that we could help :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Colum Hover Effect’ is closed to new replies.