#1 Hi Leute, ich hatte grad ein Blackout und hab nichts mehr gewusst und deshlab hab ich gegoogelt wie man ein div container mittig ausrichtet und habe folgendes gefunden: Code: #header { position:absolute; width:800px; height:200px; left:50%; margin-left:-400px;} Ist die möglichkeit in Ordnung oder nicht richtig? Geht das das ich das absolut positioniere? Wie kann man den Inhalt vertikal und horizontal mit Flexbox zentrieren. Danke im Voraus! Mfg xXxPeterPanxXx #3 Hallo Peter, das funktioniert - aber nur solange, wie Dein Viewport breiter als 800px ist... sinnvoller ist, auf die (absolute) Positionierung zu verzichten und es mit margin:auto; zu machen. Grüße Bernhard
Diese setzt Ihr dann in ein Minus (-). Sieht so aus -200px (für die Höhe). Sollte aber mit den richtigen Anweisungen geschrieben sein. [sourcecode language="css"] margin-left:-300px; margin-top:-200px; [/sourcecode] Wenn ich nun das Ergebnis anschaut, steht der Container, genau in der Mitte. Html div mittig ausrichten. Noch mal die komplette CSS Anweisung. [sourcecode language="css"]. center_box { position:absolute; width:600px; height:400px; left:50%; top:50%; margin-left:-300px; margin-top:-200px; overflow:auto;} [/sourcecode] KOMMENTARE (3) "div Container absolut mittig Positionieren" Schreibe einen Kommentar
24. 03. 2010, 14:39 #1 Contao-Fan Mehrere DIVs, welche nebeneinander sind, mittig ausrichten. Hallo, ich habe mehrere DIVs nebeneinander, welche von einem anderen DIV umschlossen sind. Nun möchte ich, dass die DIVs zentriert angezeigt werden. Beispiel: Code:
Bei einer Textrichtung rtl müsste man bei dem Beispiel die Klassen links und rechts wie folgt ändern. { margin-left: 0; border: 1px solid black;} Die übrigen Einstellungen würden so bleiben und die Positionen der Block-Elemente sind mit den Änderungen bei rtl wie bei der Textrichtung ltr. Die Texte werden jedoch an den rechten Rändern des jeweiligen Block-Elements ausgerichtet, da die Textrichtung von rechts nach links ist. Mehrere DIVs, welche nebeneinander sind, mittig ausrichten.. Die Rahmen dienen nur zur besseren Sichtbarkeit der Elemente.
Ich habe versucht, align-items-center und zu verwenden align-self-center, aber es funktioniert nicht. Was vermisse ich? DEMO Antworten: Update 2019 - Bootstrap 4. 3. 1 Es gibt keine Notwendigkeit für zusätzliche CSS. Was bereits in Bootstrap enthalten ist, funktioniert. Stellen Sie sicher, dass die Behälter des Formulars die volle Höhe haben. Bootstrap 4 hat jetzt eine h-100 Klasse für 100% Höhe... Vertikale Mitte: