div zentrieren
Houyhnhnm
- css
-1 Piere0 Detlef G.0 Gunnar Bittersmann0 Detlef G.0 Ashura0 Gunnar Bittersmann0 Ashura0 Gunnar Bittersmann0 wahsaga0 Ashura
Wie kann man einen div horizontal *und* vertikal zentrieren.
Das ganze soll auch nach einem Window-Resize zentriert bleiben - etwa so, wie ein centered Hintergrundbild ohne Wiederholung - ohne daß man per JS irgendwas rumrechnen muß.
Wie kann man einen div horizontal *und* vertikal zentrieren.
Das ganze soll auch nach einem Window-Resize zentriert bleiben - etwa so, wie ein centered Hintergrundbild ohne Wiederholung - ohne daß man per JS irgendwas rumrechnen muß.
:) tausend mal probiert, nie ist was passiert.
Kurzum, das geht nicht. Bin dann bei dieser Sache wieder zu Tabellen übergegangen...
Hallo Houyhnhnm
Wie kann man einen div horizontal *und* vertikal zentrieren.
Wenn dieses Div eine definierte Größe hat, dann schau dir mal
Zentrieren mit nur einem Element _und_ die dort verlinkten Seiten an.
(besonders natürlich das CSS in den Quelltexten)
Auf Wiederlesen
Detlef
Hello out there!
Wie kann man einen div horizontal *und* vertikal zentrieren.
Alternativ zu [Detlef] in moderenen Browsern auch:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test</title>
<style type="text/css">
[code lang=css]html {
display: table;
width: 100%;
height: 100%;
}
body {
display: table-cell;
width: 100%;
height: 100%;
vertical-align: middle;
}
div {
width: 150px;
height: 100px;
margin: auto;
border: 2px solid #999;
padding: 1em;
}
</style>
</head>
<body>
<div>
<p>Lorem ipsum dolor sit amet</p>
</div>
</body>
</html>[/code]
See ya up the road,
Gunnar
Hallo Gunnar
... in moderenen Browsern auch:
Ja leider, wenn es diese Einschränkung nicht gäbe, dann wäre dies auch meine
empfohlene Lösung.
So verweise ich weiter auf die grundsätzlichen Varianten mit absoluter
Positionierung und auf CSS vertical centering using float and clear.
Auf Wiederlesen
Detlef
Danke! Ich werds ausprobieren.
Um Tabellen habe ich mich bisher gedrückt, aber die scheinen ja für einiges mehr als Zahlenkolonnen nützlich zu sein...
Hallo Houyhnhnm
Danke! Ich werds ausprobieren.
Um Tabellen habe ich mich bisher gedrückt, aber die scheinen ja für einiges mehr als Zahlenkolonnen nützlich zu sein...
Wo habe ich Tabellen vorgeschlagen?
Auf Wiederlesen
Detlef
Wo habe ich Tabellen vorgeschlagen?
Das muß schon ein paar Tage her sein - prost.
Hallo Gunnar.
Alternativ zu [Detlef] in moderenen Browsern auch:
Wobei diese Methode meinen alten Konqueror 3.4 zum Absturz gebracht hat.
(Im Endeffekt lag es an der Veränderung der display-Eigenschaft für das body-Element.)
Einen schönen Samstag noch.
Gruß, Ashura
Hello out there!
in moderenen Browsern
vs.
meinen alten Konqueror 3.4
;-)
See ya up the road,
Gunnar
Hallo Gunnar.
in moderenen Browsern
vs.
meinen alten Konqueror 3.4
;-)
Naja, „alt“ war etwas übertrieben; aktuell ist Version 3.5.
Einen schönen Samstag noch.
Gruß, Ashura
Hello out there!
in moderenen Browsern
Naja, „alt“ war etwas übertrieben; aktuell ist Version 3.5.
Ich sprach auch von „moderenen Browsern“, nicht von „neuen“. ;-)
See ya up the road,
Gunnar
hi,
meinen alten Konqueror 3.4
Naja, „alt“ war etwas übertrieben; aktuell ist Version 3.5.
Sind da bei den Fricklern™ nicht immer noch an dritter, vierter und fünfter Stelle ettliche Versionsunternummern dazwischen?
scnr,
wahsaga
Hallo wahsaga.
meinen alten Konqueror 3.4
Naja, „alt“ war etwas übertrieben; aktuell ist Version 3.5.
Sind da bei den Fricklern™ nicht immer noch an dritter, vierter und fünfter Stelle ettliche Versionsunternummern dazwischen?
Jaja, hast ja Recht; es ist die Version 3.5.1.
Einen schönen Samstag noch.
Gruß, Ashura