admin管理员组

文章数量:1203189

I'm working on my personal portfolio with bootstrap and the navigation dropdown has a caret as you can see at .

The caret next to portfolio is ok but when you click on portfolio the dropdown also has a white caret on top. Does anyone knows how to remove this one?

I'm working on my personal portfolio with bootstrap and the navigation dropdown has a caret as you can see at http://portfolio.tomvervoort.net.

The caret next to portfolio is ok but when you click on portfolio the dropdown also has a white caret on top. Does anyone knows how to remove this one?

Share Improve this question edited Jun 11, 2012 at 23:42 James Allardice 166k22 gold badges334 silver badges315 bronze badges asked May 29, 2012 at 11:21 TomTom 1932 gold badges2 silver badges9 bronze badges 0
Add a comment  | 

6 Answers 6

Reset to default 13

Your caret is inside .dropdown-menu:after. So, write like this:

.navbar .dropdown-menu:after{
 display:none;
}

Had the same problem in Rails (with twitter bootstrap rails gem), and the fix was slightly different.

.navbar .nav > li > .dropdown-menu::after, 
.navbar .nav > li > .dropdown-menu::before {
  display:none;
}

In the current version of TBS (v2.2.1), you also need to target the :before pseudo-selector like so:

.navbar .dropdown-menu:after, .navbar .dropdown-menu:before {
    display:none;
}

Try doing this:

.navbar .nav > li > .dropdown-menu:before,
.navbar .nav > li > .dropdown-menu:after {
    display:none;
}

works fine for me. :-)

from git hub post now we can directly use noCaret prop. this post is basically from DropDownButton but it works for NAvButton as well

After trying a few solutions and trying to follow the right class references, a quick fix, but nest it if you can so it doesn't affect other global a tags:

a::after {
    content: none !important;
}

本文标签: javascriptRemove bootstrap dropdown caretStack Overflow