fullwidth drop down background navigation

Question

Я хотел бы иметь навигацию, которая имеет полноразмерный фон. При зависании ссылки следует также не показывать только текстовые ссылки, а также фон с полной шириной (навигация).

Есть ли у кого-нибудь идеи?

код до сих пор:

http://jsfiddle.net/u9r8wc6b/

<div class="navigation" id="fdw"> 
     <nav> 
      <ul> 
       <li><a href="#">home</a> 

         <ul style="display: none;" class="sub_menu"> 
          <li><a href="#">Home Service</a></li> 
          <li><a href="#">Home Responsive</a></li> 
         </ul> 
       </li> 
       <li><a href="#">about</a></li> 
       <li> 
        <a href="#">portfolio</a> 
        <ul style="display: none;" class="sub_menu"> 
         <li><a href="#">Portfolio 3 </a></li> 
         <li><a href="#">Portfolio 4 </a></li> 
         <li><a href="#">Portfolio Single</a></li> 
         <li><a href="#">Portfolio Two</a></li> 
        </ul> 
       </li> 
       <li><a href="#">contact</a></li> 
      </ul> 
     </nav> 
</div> 

Я добавил изображение, чтобы сделать его более ясным:

http://s14.directupload.net/images/141017/9b6443c4.jpg

Много много спасибо заранее

Answer 1

I нужно еще несколько объяснений е. Если вы просто хотите выделить фон в раскрывающемся списке, даже после того, как он сдвинется вниз, вы можете использовать css, как это. фон: красный.