8

の要素のスクロールバーに問題がありposition: absoluteます。私が経験している動作は、chrome 21 と firefox 15 がボックス内にスクロールバーを表示し、コンテンツのサイズを変更してテキストの一部を非表示にしますが、opera 12 と Internet Explorer 9 は内側にも表示しますが、コンテンツのサイズを変更せずにサイズを変更します。代わりにボックスを使用します (ボックスには幅が定義されていないため、これは正しいと思います)。これらの 4 つのブラウザーでこれを同じように見せるための解決策はありますか?

JsFiddle: http://jsfiddle.net/Kukkimonsuta/GaMD7/2/

編集：Siva Charanが指摘したように、overflow-yが「scroll」に設定されている場合は正しく機能しますが、スクロールバーは常に表示されますが、これは望ましくありません

編集： Siva Charanからの回答と匿名の反対票に基づく私の最終的な解決策は不十分です

http://jsfiddle.net/Kukkimonsuta/GaMD7/15/

function updateAutoScroll(element) {
    var $element = $(element);

    if (element.scrollHeight > element.clientHeight) 
        $element.css("overflow-y", "scroll");
    else 
        $element.css("overflow-y", "auto");
}
4

3 に答える 3

1

overflow-y: scroll;に追加.container.two

.container.two {
    top: 250px;
    overflow-y: scroll;
}

ライブデモを参照

アップデート：

快適な場合は、実際のスペースtext-overflow: ellipsis;に置き換えて使用できます 

于 2012-09-10T13:48:06.287 に答える
0

これは実際の解決策というよりは回避策ですが、十分な場合があります。基本的に、最初にの内容をcontainer two別のでラップしdiv、それにいくつかの正しいパディングを追加します。width: 100%に設定していることを確認してください.item。

これがあなたのデモの修正版です：小さなリンク。

これは完璧ではありませんが、お役に立てば幸いです。

于 2012-09-10T14:20:07.757 に答える