How to Add Border “Dividers” Between Menu Items in Header Style Three

This little bit of CSS will add borders between your items in header style three (bottom centered menu). The CSS of course can be tweaked to better fit your needs but it's a good starting point.

.navbar-style-three .dropdown-menu > li {
    border-right: 1px solid #ddd;
}

.navbar-style-three .dropdown-menu > li:last-child {
    border: 0;
}

.navbar-style-three {
    padding-top: 15px;
    padding-bottom: 15px;
}

.navbar-style-three .dropdown-menu > li > a {
    height: auto;
    line-height: normal;
}

.navbar-style-three .dropdown-menu > li > a > span.link-inner {
    padding-top: 0;
    padding-bottom: 0;
}
Learn how to add custom CSS to your site.
Related Snippets
  • This snippet was last updated on
Back To Top