How to add a colored line under Divi Main Navigation

Posted by George Nicolaou

On 22 Nov, 2018
George Nicolaou - Senior Web Developer

Just use the code below. Remember to change colors

/*line under menu start*/
#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: #010f77; /* Change your color here */
width: 100%;
height: 2px;
-webkit-transform: translateY(24px);
transform: translateY(24px);
opacity: 0;
transition: 0.3s ease;
}
/*line under menu end*/

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *

Pin It on Pinterest

Share This
Divi Theme Code SnippetsHow to add a colored line under Divi Main Navigation