This article is has some common CSS code I use on my WordPress websites.
Disable default Divi bottom footer
#footer-bottom{#footer-bottom{ display:none;}
Center Mobile Menu
.et_header_style_centered #main-header .mobile_menu_bar_toggle { left: 50%; left: calc(50% - 16px);} .et_fixed_nav #main-header {position: fixed !important;}
Main Menu styling (Underline animation on hover)
#top-menu .current-menu-item a::before { -webkit-transform: translateY(18px); transform: translateY(18px); opacity: 1.0; } #top-menu li a:hover:before { -webkit-transform: translateY(18px); transform: translateY(18px); opacity: 1; } #top-menu li a:before { content: ''; position: absolute; top: 10px; left: 0; background: #fac500; /* Change your color here */ width: 100%; height: 2px; -webkit-transform: translateY(24px); transform: translateY(24px); opacity: 0; transition: 0.3s ease; } ul#top-menu li.menu-item:not(:last-child) { padding-right: 40px !important; } #top-menu-nav #top-menu a:hover, #mobile_menu_slide a:hover { color: #fac500 !important; opacity:1 !important; }
Configure menu or text to hover (change color)
/** Footer Menu ***/ .footer-menu span a:hover{ color:#fac500 !important; }
Blurb Animation (Image zoom out on hover)
0 Comments