Ergebnis 1 bis 3 von 3

Thema: Absolutes Div in variablem Div mittig platzieren

  1. #1
    Teeny
    Registriert seit
    01.08.2011
    Ort
    bei München
    Beiträge
    45
    Danke
    0
    Bekam 1 mal "Danke" in 1 Posting

    Standard 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-Code:
     <div class="box-ref-kl <?php if($i==2)echo ' clearfix'?>"><img class="mittig" src="images/projekte/<?php echo $zeile['bild1']?>">
               <div class="infotext"> <p class="gross"><?php echo $zeile['kleinertext']?></p><p><?php echo $zeile['auftraggeber']?></p> </div>
             </div>
    hier nur einmal, da es als Schleife aus der Datenbank kommt

    CSS:
    Code:
    .box-ref-kl{
        position:relative;
      display:inline-block;
      float:left;
      width: 24%;
      min-width: 270px;
      height: 270px;
       margin-left: 3%;
       margin-top: 10px;
       
      background:rgba(255,255,255,.7);
      padding:15px;
      -moz-border-radius: 15px;
       -webkit-border-radius: 15px;
       border-radius: 15px;
       /*text-align:center;*/
       
      
    }
    
    .infotext{
    display:block;
     width:230px;
     height: 210px;
     background: #e28005;
     color: #fff;
     padding: 15px;
     position: absolute;
     top:15px;
     margin:auto;
    /* margin-top:3%;*/
     /*margin-left:auto;*/
     padding-left:auto;
     
     
    }
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Meister(in) Avatar von lukasn
    Registriert seit
    23.02.2008
    Ort
    Schweiz
    Alter
    27
    Beiträge
    491
    Danke
    2
    Bekam 12 mal "Danke" in 11 Postings

    Standard AW: Absolutes Div in variablem Div mittig platzieren

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

    Code:
    .infotext {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 230px;
        height: 210px;
        margin-left: -115px;
        margin-top: -105px;
    }
    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

  3. #3
    Teeny
    Themenstarter

    Registriert seit
    01.08.2011
    Ort
    bei München
    Beiträge
    45
    Danke
    0
    Bekam 1 mal "Danke" in 1 Posting

    Standard AW: Absolutes Div in variablem Div mittig platzieren

    SUper! Tausend Dank für deine Hilfe. Klappt wunderbar.
    lg Nadja

Ähnliche Themen

  1. Div übereinander platzieren?
    Von Joe Petts im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 05.08.2010, 13:11
  2. CSS Rahmen platzieren
    Von Joe Petts im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 21.12.2009, 17:10
  3. Variablem Text auf Grafik einbinden
    Von Guest im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 3
    Letzter Beitrag: 01.09.2006, 09:20
  4. IE alles OK , FF absolutes Chaos
    Von xXx im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 03.07.2006, 13:18
  5. Fenster platzieren
    Von Johannes im Forum HTML & CSS Forum
    Antworten: 8
    Letzter Beitrag: 21.06.2004, 22:41

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •