Reply To: Fix a few style issues with Mega Menu on a Bootstrap3 site?

[admin]

Hi,

You would need to edit the following file:

https://www.easydigging.com/kern/jquery.smartmenus.bootstrap.css

1) Remove your spacer <li>‘s from your navbar HTML source and in the CSS file above find and replace the following:

@media (min-width: 768px) {
  #main-menu {
    float: right;
    clear: none;
  }
}

with the following:

@media (min-width: 768px) {
  .navbar-collapse {
    text-align: center;
    font-size: 1px;
  }
  #main-menu {
    display: inline-block;
    float: none;
    clear: none;
  }
}

2) The issue is caused by your custom .nav-tweak DIV’s that are inside your main menu links. To avoid it, in the same CSS file, replace the following:

.navbar-nav.sm-collapsible .open > a > .caret:before {
  content: '-';
}

with the following:

.navbar-nav.sm-collapsible .open > a .caret:before {
  content: '-';
}

Cheers!