Ich habe einige Probleme mit Bildlaufleisten auf Element mit position: absolute
. Das Verhalten, das ich erfahre, ist, dass chrome 21 und firefox 15 scrollbars innerhalb des Kastens anzeigt, sein Inhalt redigierend und so etwas des Textes versteckend, jedoch opern 12 und Internet Explorer 9 es auch auf der Innenseite anzeigt, aber ohne seinen Inhalt und die Größenänderung zu ändern die Box stattdessen (was meiner Meinung nach richtig ist, da die Box keine Breite definiert hat). Gibt es eine Lösung, um dieses Aussehen in diesen 4 Browsern gleich zu machen?
JsFiddle: Ссылка
Edit: wie Siva Charan darauf hingewiesen hat, funktioniert es korrekt, wenn overflow-y auf "scroll" eingestellt ist, aber immer Scrollbalken zeigt, was nicht erwünscht ist
Bearbeiten: Meine endgültige Lösung basiert auf Antworten von Siva Charan und Anonymous Down-Voting ist lahm
%Vor%Die einzige Möglichkeit, dies dynamisch in allen Browsern zu tun, ist JavaScript. Aus Gründen der Einfachheit habe ich jQuery verwendet.
%Vor% Fügen Sie overflow-y: scroll;
zu .container.two
Lesen Sie LIVE DEMO
Wenn Sie sich wohl fühlen, können Sie text-overflow: ellipsis;
verwenden und
zu tatsächlichem Speicherplatz
Dies ist eher ein Workaround als eine tatsächliche Lösung, aber es könnte gut genug sein. Im Grunde, wickle zuerst den Inhalt von container two
in ein anderes div
und füge ein paar richtige Füllzeichen hinzu. Stellen Sie sicher, dass Sie auch width: 100%
in .item
festgelegt haben.
Hier ist eine modifizierte Version Ihrer Demo: kleiner Link .
Das ist nicht perfekt, aber ich hoffe es hat geholfen!
Tags und Links css