CODEWITHSUNDEEP
htmlcsswordpress
Tom11
Tom11

Reputation: 2519

Hover effect in navigation menu (wordpress)

I´m creating web page in wordpress, and I have navigation menu using <?php wp_nav_menu(); ?> .. The problem is, I want to create hover effect, displayed in enclosed image. http://s11.postimage.org/gclhor5hv/try.jpg

The problem is, I don´t know how to create that triangle on the bottom of the hovered list item. Here´s the CSS:
#navHead li a:hover{
background-color: #e00d1d;
border-radius: 5px;
color: #fff!important;
background-repeat: no-repeat;
background-position: 50% 30px;
}

In HTML: navigation list is generated, so I can´t reach and edit structure, so it has to be done in CSS.

Thanks for your help.

Upvotes: 1

Views: 2300

Answers (1)

Mark
Mark

Reputation: 3271

This generator will generate the css for a speech bubble in CSS 3: http://cssarrowplease.com/

Upvotes: 2

Related Questions