расширить один DIV всех дивы, чтобы взять полную ширину по наведению

Question

я закодировал 6 дивы рядом друг с другого

, как я могу сделать один деление с только расширить, чтобы взять всю ширину завернутых DIV при наведении курсора мыши и других 5 дивов попасть на дно в полностью развернутом DIV

HTML:

<div class="row"> 

<div class="col-md-2" id="discuss_block"> 
div1..... 
</div> 

<div class="col-md-2" id="discuss_block"> 
div2..... 
</div> 

<div class="col-md-2" id="discuss_block"> 
div3..... 
</div> 

<div class="col-md-2" id="discuss_block"> 
div4..... 
</div> 

<div class="col-md-2" id="discuss_block"> 
div5..... 
</div> 

<div class="col-md-2" id="discuss_block"> 
div6..... 
</div> 

</div> 

CSS:

#discuss_block{ 
    background: #FFBC2F; 
    color: #FFF; 
    z-index: 30; 
    top: 0px; 

} 

#discuss_block:hover{ 
width:100%; 
} 

Answer 1

Вы можете использовать float:lefthttp://jsfiddle.net/sfnxkav5/1/

#discuss_block{ 
width:50px; 
float:left; 
background: #FFBC2F; 
color: #FFF; 
z-index: 30; 
top: 0px; 
}