あなたがホバリングしたときに境界線を操作しない

Question

マウスを1つのdivに置いたときに必要となる、他のdivとparametresが下から表示され、これらのdivに共通の境界線があります。

今、最初のdivにのみ境界線があります。最初のdivには2番目の要素は含まれていないようですが、html codeのdivでparametresが最初に使用されています。

どうしたのですか？

.item { 
 
\t width: 220px; 
 
\t height: 300px; 
 
\t margin: 10px 3px; 
 
\t float: left; 
 
\t position: relative; 
 
\t } 
 

 
.item:hover .item_inner { 
 
\t position: absolute; 
 
\t top: 0; 
 
\t left: 0; 
 
\t z-index: 10; 
 
\t background: #fff; 
 
\t box-shadow: 0 1px 14px rgba(0,0,0,0.3); 
 
\t height: 100%; 
 
} 
 

 
.item_param { 
 
\t display: none; 
 
\t text-align: left; 
 
\t padding: 0 5px; 
 
\t margin: 10px 0; 
 
\t background-color: #f3f3f3; 
 
} 
 
\t 
 
.item_inner{ 
 
\t width: 100%; 
 
\t height: 100%; 
 
\t position: relative; 
 
\t padding-bottom: 5px; 
 
\t border: 1px solid green; 
 
} 
 

 
.item_inner:hover .item_param { 
 
\t display: block; 
 
\t top: 100%; 
 
\t width: 100%; 
 
\t position: absolute; 
 
}

<div class="item"> 
 
\t \t <div class="item_inner"> 
 
\t \t \t \t TEXT 
 
\t \t \t <div class="item_param"> 
 
\t \t \t \t <p>Parametres</p> 
 
\t \t \t \t <p>Parametres</p> 
 
\t \t \t \t <p>Parametres</p> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </div>

Answer 1

.item_inner:hover .item_param { 
    display: block; 
    top: 100%; 
    width: 100%; 
    position: relative; 
}