Dropdown menu CSS issue

Question

I created a dropdown menu for my Wordpress website. In this jsfiddle you can find the HTML and CSS code: http://jsfiddle.net/N5H4c/

see jsfiddle

I have a CSS problem there. I created the dropdown menu but when I hover 'Menu item One' it stretches and gains more width. That should not be. The sub menu items can be larger but the menu item itself shouldn't change the size. Further there is this yellow background everywhere around it when I hover the menu and I would like to remove it.

"Links to jsfiddle.net must be accompanied by code."

Adam Plocher
– Adam Plocher

2013-04-24 19:53:30 +00:00
Commented Apr 24, 2013 at 19:53 — Adam Plocher
– Adam Plocher, Commented Apr 24, 2013 at 19:53
The code is present in jsfiddle.

Miro Markaravanes
– Miro Markaravanes

2013-04-24 19:57:51 +00:00
Commented Apr 24, 2013 at 19:57 — Miro Markaravanes
– Miro Markaravanes, Commented Apr 24, 2013 at 19:57

Gray · Accepted Answer · 2013-10-18 16:44:41Z

2

You need to update

#menu ul {
    position: absolute;
    background: #f7e600;
}

check jsfiddle

http://jsfiddle.net/N5H4c/5/

edited Oct 18, 2013 at 16:44

Gray

7,1602 gold badges33 silver badges53 bronze badges

answered Apr 24, 2013 at 19:55

Harshit Tailor

3,2816 gold badges30 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Kaloyan · Accepted Answer · 2013-04-24 19:59:54Z

2

Add

position: absolute;
top: 38px; // your menu's height
left: 0;
white-space: nowrap;

to #menu ul : http://jsfiddle.net/N5H4c/2/

answered Apr 24, 2013 at 19:59

Kaloyan

7,3324 gold badges36 silver badges49 bronze badges

Collectives™ on Stack Overflow

Dropdown menu CSS issue

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related