bootstrap rimuove la freccia verso l'alto nel menu a discesa

Question

Sto usando Twitter bootstap e desidero rimuovere la freccia verso l'alto nel menu a discesa whis è nel mio nav. Non riesco a trovare un riferimento nel bootstrap.css.

.navbar .dropdown-menu:after { 
content: ''; 
display: inline-block; 
border-left: 6px solid transparent; 
border-right: 6px solid transparent; 
border-bottom: 6px solid #000; /* change color here, modified for a black arrow */ 
position: absolute; 
top: -6px; 
left: 10px; 
} 

Answer 1

Non ti consiglierei di modificare il file bootstrap.css. È possibile sovrascrivere lo stile nel foglio di stile personalizzato per nascondere la freccia per quel componente come questo:

.dropdown-menu:after { 
    border: none !important; 
    content: "" !important; 
} 

Con questo metodo si può anche fare la sovrascrittura solo per un menu a discesa specifica. Ad esempio, se il menu a discesa era un bambino di un elemento con l'id my_dropdown, si potrebbe fare:

#my_dropdown .dropdown-menu:after { 
    border: none !important; 
    content: "" !important; 
} 

Ciò permetterebbe di avere una freccia per altri menù a discesa, mentre nascondendola per questa specifica discesa.

Answer 2

il seguente CSS ha lavorato per me:

.dropdown-menu:before, 
.dropdown-menu:after { 
    border: none !important; 
    content: none !important; 
} 

Se si rimuove una delle due selettori, qualche dettaglio dalla freccia rimarrebbe ancora - o un grigio o un triangolo bianco.

(appena deciso di aggiungere questo nel caso in cui qualcuno è alla ricerca di una risposta più tardi, come la risposta accettata non ha funzionato per me.)

Answer 3

È anche possibile fare:

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

Questa volontà disabilita la freccia e la sua ombra.