Supportnet / Forum / Webseiten/HTML
Größe von einem Div
Frage
Hallo.
Ich möchte auf einer Seite ein Div verwenden. Die Größe des Div soll mit CSS festgelegt werden und sich auch nicht bei übergroßem Inhalt verändern. Das Div soll um 40 Pixel weniger als 100% der Fensterhöhe hoch sein und um 120 Pixel weniger als 100% der Fensterbreite breit sein. Im Div sollen bei übergroßem Inhalt Scrollbars erscheinen. Weiß jemand wie man sowas möglichst einfach realisieren kann?
Antwort 1 von Gott
§1 Es ist nicht in Ordnung absolute Pixelgrößen zu verwenden. Einzige Ausnahme: Wenn eine eigentlich relative Fläche aufgrund einer außerhalb befindlichen Pixelgrafik an diese angepaßt werden muß. Das ist zwingend erforderlich weil es noch keine ausreichende SVG-Unterstützung gibt.
§2 Der Inhalt paßt sich der Umgebung an. Nicht wie bei Dir genannt, daß bei einem übergroßen Inhalt ein Scrollbalken erscheint.
§2 Der Inhalt paßt sich der Umgebung an. Nicht wie bei Dir genannt, daß bei einem übergroßen Inhalt ein Scrollbalken erscheint.
Antwort 2 von rfb
laut Boxmodell müsste
als Eigenschaft des DIVs das ergeben (+
width:100%; height:100%; margin:20px 60px; overflow:auto;
als Eigenschaft des DIVs das ergeben (+
height:100%;width:100%
für den body), aber ob alle Browser mitspielen?Antwort 3 von Friedel
@Gott: Was willst du mit deinem Posting sagen? Was hat meine Frage mit SVG zu tun?
@rfb: Das geht so nicht. In der Seite ist links ein Div mit
Links vom ersten Div und unter den beiden anderen Divs soll ein weiteres Div Platz finden. Es soll den maximalen zur Verfügung stehenden Platz einnehmen. Im Moment verwende ich
Das left: 120px; brauche ich damit die Scrollbar des linken Div dieses Div nicht in einigen Browsern überdeckt. Sonst würde ich natürlich left: 100px; verwenden. Außerdem ist das Div jetzt bei kleinem Inhalt nicht breit genug.
Das ganze soll in einer Fotopräsentation verwendet werden. Man braucht also keine Rücksicht darauf zu nehmen, wie das ganze in Fenstern dargestellt wird, die kleiner als VGA sind.
Wenn mir (oder sonst jemandem) nicht bald eine Lösung einfäält, muss ich wohl auf die gute alte Positionierungstabelle zurück greifen. Bei einer Fotopräsentation brauche ich auf Blindenbrowser u.ä. zum Glück keine Rücksicht zu nehmen.
@rfb: Das geht so nicht. In der Seite ist links ein Div mit
Zitat:
<div style="width:120px; height:100%; overflow:auto; float:left;">
Daneben ist oben ein Div mit <div style="width:120px; height:100%; overflow:auto; float:left;">
Zitat:
style="position:absolute; top:0; left: 120px; height:40px; overflow:hidden; visibility:visible;"
und noch eins mit style="position:absolute; top:0; left: 120px; height:40px; overflow:hidden; visibility:visible;"
Zitat:
style="position:absolute; top:0; right: 0; height:40px; overflow:hidden; visibility:visible;"
style="position:absolute; top:0; right: 0; height:40px; overflow:hidden; visibility:visible;"
Links vom ersten Div und unter den beiden anderen Divs soll ein weiteres Div Platz finden. Es soll den maximalen zur Verfügung stehenden Platz einnehmen. Im Moment verwende ich
Zitat:
<div style="position:absolute; top:40px; left: 120px; height:100%; overflow:auto; text-align:center;">
Aber das Div ist natürlich 40 Pixel zu hoch.<div style="position:absolute; top:40px; left: 120px; height:100%; overflow:auto; text-align:center;">
Das left: 120px; brauche ich damit die Scrollbar des linken Div dieses Div nicht in einigen Browsern überdeckt. Sonst würde ich natürlich left: 100px; verwenden. Außerdem ist das Div jetzt bei kleinem Inhalt nicht breit genug.
Das ganze soll in einer Fotopräsentation verwendet werden. Man braucht also keine Rücksicht darauf zu nehmen, wie das ganze in Fenstern dargestellt wird, die kleiner als VGA sind.
Wenn mir (oder sonst jemandem) nicht bald eine Lösung einfäält, muss ich wohl auf die gute alte Positionierungstabelle zurück greifen. Bei einer Fotopräsentation brauche ich auf Blindenbrowser u.ä. zum Glück keine Rücksicht zu nehmen.