CODEWITHSUNDEEP
css
MayurOnWordpress
MayurOnWordpress

Reputation: 41

How to remove CSS triangles?

How do I remove the CSS triangles on main menu items that don't have a sub-menu?

See http://v2.letsfaceitbeauty.ca

I think this is the relevant CSS code and I believe ".has-sub" is the correct selector, but I can't figure out how.

#cssmenu > ul > li:hover:after { /* this is the arrow */
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: 50%;
bottom: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #6796ff;
margin-left: -10px;
}

Upvotes: 0

Views: 489

Answers (1)

Musa
Musa

Reputation: 97672

If you know the css that makes the triangle and the element you want the triangle on, just put those two pieces together, i.e. replace the previous rule with

#cssmenu > ul > li.has-sub:hover:after { /* this is the arrow */
   content: '';
   display: block;
   width: 0;
   height: 0;
   position: absolute;
   left: 50%;
   bottom: 0;
   border-left: 10px solid transparent;
   border-right: 10px solid transparent;
   border-bottom: 10px solid #6796ff;
   margin-left: -10px;
}

Upvotes: 2

Related Questions