css - 相対divの絶対divの合計左位置?

Question

私は次のコードを持っています：

フィドル

.item {
    width: 120px;
    padding: 10px;
    display: block;
    background-color: #CCC;
    float: left;
    margin: 5px;
    position: relative;
}

.item .item-preview {
    position: relative;
    z-index: 10;
    display: block;
}

.item .item-content {
    /*display: none;*/
   position: absolute;
   left: 0px;
   top: 37px;
   padding: 5%;
   z-index: 11;
   width: 90%;
   background-color: #000;
   color: #FFF;
}

div ".item-content" が表示されると、常に左側にあり、ページ全体と同じ幅になります。どうすればそれを行うことができますか?

Answer 1

position: relativeからを削除する.itemと、目的の効果が得られます。top: 37px;縦位置を修正するために も削除しました。それを微調整する必要がある場合は、margin-top代わりに使用してください

フィドル