Firefox Fehler bei overflow:hidden !?
Jense
- css
Hi,
Habe folgendes Problem (habe ich auch schon im Forum gefunden aber ohne Lösung):
<div style="position:absolute; width:100px; height:100px; overflow:hidden; ">
<div style="position:absolute; top:-5px; width:100px; height:110px; overflow:scroll;">
textStart<br><br><br><br><br><br><br><br><br><br><br><br>textEnd
</div>
</div>
Wird der Inhalt des inneren Containers nun gescrollt, so wird dieser im FF nicht vom äusseren Container abgeschnitten (wie im IE) sondern so angezeigt, als wenn kein overflow:hidden gesetzt wäre.
Wäre dankbar für einen Firefix...
Gruss Jens
Hi Jens,
versteh deine Frage nicht 100%ig. Bei mir sieht deine Konstruktion in IE6, IE7 und FF gleich aus.
Gegenfrage: Warum gibst du dem inneren div Werte für seine Position und dem äußeren nicht. Gib doch nur dem äußeren welche und das innere ohne position einfach da rein?
Gruß
Antipitch
PS: Doctype declaration angegeben?
Hi Jens,
versteh deine Frage nicht 100%ig. Bei mir sieht deine Konstruktion in IE6, IE7 und FF gleich aus.
Füge dem scrollbaren, inneren div eine background-color hinzu, dann sollte es sichtbar werden, dass sich der innere div sichtbar über die Grenzen des äusseren divs verschiebt. Zumindest im FF2
Gegenfrage: Warum gibst du dem inneren div Werte für seine Position und dem äußeren nicht. Gib doch nur dem äußeren welche und das innere ohne position einfach da rein?
Also kurz zum Hintergrund: Ich möchte die Scrollbalken schmaller machen, da ich ansonsten in dem betreffenden Bereich zuwenig Platz habe. Deshalb ist der innere div grösser als der äussere.
PS: Doctype declaration angegeben?
nein...könnte das ein Problem sein?
GRuss Jense
Hi Jens,
Füge dem scrollbaren, inneren div eine background-color hinzu, dann sollte es sichtbar werden, dass sich der innere div sichtbar über die Grenzen des äusseren divs verschiebt. Zumindest im FF2
really? Du solltest aber außerdem html und body margin und padding 0 geben und wissen, dass Scrollbars in IE und FF nicht die gleichen Breiten haben...
Also kurz zum Hintergrund: Ich möchte die Scrollbalken schmaller machen, da ich ansonsten in dem betreffenden Bereich zuwenig Platz habe. Deshalb ist der innere div grösser als der äussere.
Kurz zu meinem Hintergrund: Wenn du dem einen div eine position ohne Wert gibst, wirst du die niemels auf Deckung bringen. Und mit position absolute würde ich sowieso nie zu normalen layout Zwecken arbeiten. Also so:
<div style="width:95px; height:105px; overflow:hidden;">
<div style="width:100px; height:110px; overflow:scroll;">
textStart<br><br><br><br><br><br><br><br><br><br><br><br>textEnd
</div>
</div>
PS: Doctype declaration angegeben?
nein...könnte das ein Problem sein?
Mit Sicherheit. Nimm z.B. diese
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Gruß
Antipitch
Hallo,
PS: Doctype declaration angegeben?
nein...könnte das ein Problem sein?Mit Sicherheit. Nimm z.B. diese
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Das ist das größte Problem von allen. Ohne Doctype (und manchmal mit) verhalten sich die Browser sehr sehr unterschiedlich.
Ich rate dir eher zu einem HTML-Doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
oder:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Mit dem ersten Versuchen die Browser die Seite nach standardisierten Regeln zu verarbeiten, das ist der zukunftssichere Modus.
Mit dem zweiten versuchen die Browser das zwar auch, erlauben aber einige Fehlerchen. Dieser Modus hat aber keine Zukunft. Also besser immer mit Strict arbeiten.
Je nach Doctype musst du das Doukment nactürlich auch den Regeln entsprechend bearbeiten (in Strict ist. z.B. das target-Attribut verboten).
Gruß;