mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 01:04 Benutzername: Passwort: Auto-Login

Thema: Div Container zentrieren vom 19.07.2013


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Div Container zentrieren
Autor Nachricht
Mayer10Mail
Threadersteller

Dabei seit: 13.09.2011
Ort: -
Alter: -
Geschlecht: -
Verfasst Fr 19.07.2013 18:06
Titel

Div Container zentrieren

Antworten mit Zitat Zum Seitenanfang

Hallo,
irgendwie komme ich auf keine Lösung, probiere schon den halben Nachmittag und habe online keine funktionierende Lösung gefunden.
Ich habe einen div-container in einem weiteren div-container verschachtelt und möchte, das der "kleine" automatisch vertikal und horizontal zentriert ist. Aber die vertikale Zentrierung bekomme ich irgendwie nicht hin. Entweder stehe ich völlig auf dem Schlau oder keine Ahnung...habe hier mal Beispiel Quelltext:

http://jsfiddle.net/gm78W/

MfG
  View user's profile Private Nachricht senden
Morgo

Dabei seit: 10.08.2005
Ort: Von Kowelenz bis Kölle
Alter: 39
Geschlecht: Männlich
Verfasst Fr 19.07.2013 20:43
Titel

Antworten mit Zitat Zum Seitenanfang

Möglichkeit 1: Absolute Positionierung und negatives Margin.

Möglichkeit 2: display: table-cell und vertical-align: middle. z.B. Sowas in der Art
  View user's profile Private Nachricht senden
Anzeige
Anzeige
dcn

Dabei seit: 20.08.2008
Ort: -
Alter: 43
Geschlecht: Männlich
Verfasst Sa 20.07.2013 00:46
Titel

Antworten mit Zitat Zum Seitenanfang

wie schon die gefühlten 100 letzten Male: http://jsfiddle.net/BLFwz/
  View user's profile Private Nachricht senden
Astro

Dabei seit: 14.04.2003
Ort: Lost Valley
Alter: 48
Geschlecht: Männlich
Verfasst Sa 20.07.2013 10:16
Titel

Antworten mit Zitat Zum Seitenanfang

dcn hat geschrieben:
wie schon die gefühlten 100 letzten Male: http://jsfiddle.net/BLFwz/

Wird wahrscheinlich schlecht von Suchmaschinen gefunden, wenn du einfach so kommentarlos einen Link ins Netz klatschst. Vermutlich schon die letzten 100 Male. *ha ha*
  View user's profile Private Nachricht senden
jbayler

Dabei seit: 22.07.2013
Ort: Kirchheim unter Teck
Alter: 47
Geschlecht: Männlich
Verfasst Mo 22.07.2013 18:37
Titel

Antworten mit Zitat Zum Seitenanfang

ich gehe mal davon aus das du das so meinst:
http://jsfiddle.net/BLFwz/2/
Was mit dem Großen DIV geht geht mit dem kleine auch ....

#
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Beispiel</title>
<style type="text/css">
#div_1 {
   width: 200px;
   height: 200px;
   background-color: #999999;
   margin-left: 100px;
   margin-top: 100px;
   z-index: 2;
}
#div_2 {
   width: 400px;
   height: 400px;
   background-color: #009999;
   left: 50%;
   top: 50%;
   position:absolute;
   padding-left: 0px;
   margin-left: -200px;
   margin-top: -200px;
   z-index: 1;
}
</style>
</head>
<body>
<div id="div_2">
  <div id="div_1"></div>
</div>
</body>
</html>





Zuletzt bearbeitet von jbayler am Mo 22.07.2013 18:53, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen CSS: Container im Container Vertikal zentrieren
[CSS] Fixen Container horizontal und vertical zentrieren
DIV Container bei Mouseover über DIV Container anzeigen
DIV-Container soll anderen DIV-Container verdrängen
Variabler Div-Container bis zum mittigen Div-Container
CSS - was ist ein div-container?
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.