html - div をコンテナーに水平方向に拡張する

Question

変更しようとしている css と html がいくつかあり、div が水平方向に拡大してスクロール可能な div になるようにしますが、幅に達すると「スタック」するだけです。

フィドル

ドキュメント構造では絶対位置が非常に重要なので、ほとんどの CSS をそのままにしておく必要があります。

何か案は？

Answer 1

white-space:nowrap;「mli」クラスに追加

フィドルhttp://jsfiddle.net/cWpGS/51/

Answer 2

私の理解が正しければ、テキストはコンテナ内に完全に伸びています。あなたの問題は、コンテナーが親 div の最後までしか拡張されず、非常に小さな幅が割り当てられていたことです。コンテナー div の幅を変更すると、テキストがそれほど折り返されなくなります。

jsフィドル

Answer 3

これは一理あると思います

.q-d-list-container {
    display:block;
    position: absolute;
    top:5px;
    left:5px;
    right:5px;
    bottom:5px;
    background:#f1f1f1;
    border:1px solid #C4C4C4;
}

#q-d-list {
    display:block;
    background:white;
    border:1px solid #D4D4D4;
    width: 150px;
    position:absolute;
    left:5px;
    top:5px;
    bottom:5px;    
    overflow : auto;
    overflow-y: hidden;
    white-space: nowrap;
}

.mli {
    padding:4px 0 4px 6px;
    margin:0;
    cursor:pointer;
}​

ここにデモがあります