Making a UL wider than it's parent LI

问题

I have a nav bar with dropdown menus, I would like the dropdown menus to stretch to whatever width necessary for the content inside it, but they will only go as wide as their parent element

I've read quite a bit on this, and most people suggest setting position:absolute on the dropdown menus. I've already done this and it doesn't effect it

My jsFiddle is here: http://jsfiddle.net/Rqgh6/

Does anyone know how I can get it the dropdowns to go wider than their parent element?

回答1:

You can simply add white-space:nowrap; to the <a> elements:

.menu ul a {font-size:12px;padding:0 10px;line-height:22px;text-align:left; white-space:nowrap;}

Updated jsFiddle.

来源：https://stackoverflow.com/questions/7175128/making-a-ul-wider-than-its-parent-li