CSS DIV auf Seite zentrieren
Lau
- css
0 Lau0 Matthias Apsel0 Lau
Hallo,
ich möchte in einer speziellen Anordnung von DIVs eines auf der Seite zentrieren und ein anderes am linken Rand der Seite haben.
Beide DIVs sind einzeilig und müssen exakt auf gleicher Höhe sein.
Wenn ich das so versuche:
#dateLabel { float:left }
#dateSelect { text-align:center }
<div id="div1>DIV1</div>
<div id="div2>DIV2</div>
Dann sind sie zwar auf gleicher Höhe, aber der Text im 2. DIV zentriert sich nur auf den rechten Bereich (also ohne DIV1), er steht also rechts von der Mitte.
DIV2 soll aber auf die ganze Seite bezogen zentriert sein. Höhe und Breite kann ich nicht fest angeben, da die Textlänge variiert und auch von der Schriftgröße abhängig ist.
Gruß
Lau
#dateLabel { float:left }
#dateSelect { text-align:center }
<div id="div1>DIV1</div>
<div id="div2>DIV2</div>
dateLabel/dateSelect soll natürlich div1/div2 sein.
Om nah hoo pez nyeetz, Lau!
<div id="div2>DIV2
<div id="div1>DIV1</div>
</div>
,
wenn ich dich richtig verstanden habe.
Matthias
Om nah hoo pez nyeetz, Lau!
<div id="div2>DIV2
<div id="div1>DIV1</div>
</div>
>
> wenn ich dich richtig verstanden habe.
>
> Matthias
Nein, das passt leider gar nicht, da sind div1 und div2 beide am linken Rand und div2 unter div1 zentriert. Dafür ist der nachfolgende Inhalt, der unverändert darunter sein sollte, rechts neben dem div1/2 Block...
Es soll am Ende so aussehen:
|"text1"\_\_\_"text2"\_\_\_\_\_\_\_\_\_\_|
|: Seitengrenze
\_: freier Platz
Also "text2" immer auf die ganze Seite zentriert und "text2" immer am linken Rand, egal wie breit die Seite ist.
@@Lau:
nuqneH
Es soll am Ende so aussehen:
|"text1"___"text2"__________|
|: Seitengrenze
_: freier Platz
Also "text2" immer auf die ganze Seite zentriert und "text2" immer am linken Rand
"text1" absolut positionieren mit left: 0 und keiner Angabe zu top oder bottom. Ist damit aus dem Fluss und beeinflusst nicht die Darstellung von "text2"
"text2" normal zentrieren.
egal wie breit die Seite ist.
Und wenn der Viewport so schmal ist, dass sich "text2" unter "text1" schiebt?
Qapla'
"text1" absolut positionieren mit left: 0 und keiner Angabe zu top oder bottom. Ist damit aus dem Fluss und beeinflusst nicht die Darstellung von "text2"
"text2" normal zentrieren.
egal wie breit die Seite ist.
Und wenn der Viewport so schmal ist, dass sich "text2" unter "text1" schiebt?
Qapla'
Danke, das funktioniert.
Das überschneiden kann zwar passieren, aber dann ist die Seite auch so schmal, das der folgende Inhalt eh nicht mehr richtig verwendet werden kann.