Меню + ниже блок div
 

<style>

ul.main_menu {width: 100%; padding:0;margin: 0; margin-top: 10px; list-style:none; height:34px; background: #fff; position:relative; border: 0;border-bottom: 3px Solid #65bc54;}
ul.main_menu li {float:left; display:inline-block;}
ul.main_menu li a.href_main_menu {line-height:34px; color:#056529; text-decoration:none; font-size:15px; text-align:center; padding:0 10px 0 10px; display:block;} 
ul.main_menu li a.href_main_menu:hover {color:#dedede; text-decoration: none;} 
ul.main_menu li a.active_href_main_menu {line-height:34px; color:#000; text-decoration:none; font-size:15px; text-align:center; padding:0 10px 0 10px; display:block;} 
</style>

<ul class="main_menu">
<li><a href="#" class="href_main_menu">Item1</a></li>
<li id="main_menu2"><a href="#" class="href_main_menu">Item2</a>
</li>
</ul>
<div class="for_main_menu2">sdsdsds</div>

Есть обычное горизонтальное меню и блок div с классом for_main_menu2, надо что бы при наведении на пункт меню Item2 появлялся этот блок и что бы он был независим от местоположения на странице + при наведении на этот блок пункт меню имел свойство :hover.

Мне надо расположить блок ниже пункта по всей ширине страницы, но проблема в том что он должен быть независим от положения((