Absolutes Div in variablem Div mittig platzieren

  • Hallo,


    ich hab eine Problem und hoffe, ihr könnt mir helfen.
    Ich habe ein Div mit einer variablen Größe. In dem div befindet sich ein absolutes Div. Dieses soll jetzt immer mittig in dem variablen Positioniert sein.
    Leider krieg ich das nicht hin. Die Prozentangaben und die Pixelangaben sind ja immer unterschiedlich und auch wenn ich das innere mit display:block und margin:auto versehen, passt es nicht.
    Ich hoffe es kann mir jemand von euch helfen.
    Oder geht das einfach nicht?


    Danke schonmal Nadja


    Zu finden ist die Seite hier: http://playground.lamisch.de/fuxdesign/
    Nutzer: CWilke
    PW: Fuxdesign


    Es geht gleich um den oberen Bereich, die hellen Kästchen mit den Bildern. Wenn man mit Mouseover über die Bilder geht, erscheinen die absoluten Divs.


    Hier noch relevanter Quelltext dazu:


    HTML
    1. <div class="box-ref-kl <?php if($i==2)echo ' clearfix'?>"><img class="mittig" src="images/projekte/<?php echo $zeile['bild1']?>">
    2. <div class="infotext"> <p class="gross"><?php echo $zeile['kleinertext']?></p><p><?php echo $zeile['auftraggeber']?></p> </div>
    3. </div>


    hier nur einmal, da es als Schleife aus der Datenbank kommt


    CSS:

  • Du solltest den infotext mit folgender Methode zentrieren können:


    Code
    1. .infotext {
    2. position: absolute;
    3. top: 50%;
    4. left: 50%;
    5. width: 230px;
    6. height: 210px;
    7. margin-left: -115px;
    8. margin-top: -105px;
    9. }


    Du setzt also einen negativen margin, welcher der Hälfte der Breite und Höhe des Elements entspricht. Dadurch kannst du Top und Left auf 50% setzen, da der Orientierungspunkt für diese angaben (obere linke Ecke des elements) in die Mitte des Elements verschoben wurde.


    Gruss,
    -Lukas