How to make the absolute child width independent from the relative parent width?

Question

I need to realize this menu with its submenu:

I set the main menu to be a ul/li with li float: left; display: b

Answer 1

Try this

add one class as like this

Css

.submenu{display:inline-block;}

your nav code

<div class="main_menu_submenu">
<ul class="submenu"> //---------------- Remove clearfix class and add submenu class this ul
<li>
<a href="/">La storia</a>
</li>
<li>
<a href="/">Le persone</a>
</li>
</ul>
</div>

Demo

Answer 2

Just delete the position:relative; of #main_menu li

http://jsfiddle.net/STfGL/4/