Skip to content

Snippet: 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;
}
Back To Top