Ergebnis 1 bis 5 von 5

Thema: horizontale und vertikale zentrierung: verschiedene bilder in einem floatenden div

  1. #1
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard horizontale und vertikale zentrierung: verschiedene bilder in einem floatenden div

    hoi
    das hier is der beispiel-source:

    HTML-Code:
    <div class="FRight thuWrap">
            <div class="thumb">
                <div>
                    <img src="3704529.jpg" alt="" />            
                </div>
            </div>
            <div class="thumb">
                <div>
                    <img src="4194631.jpg" alt="" />
                </div>
            </div>
        </div>
    CSS:
    Code:
    .thuWrap .thumb
        {
            width:49px;
            height:49px;
            border:1px solid lime;
            float:left;
            text-align:center;
            margin-right:12px;
            margin-bottom:12px;
        }
    die bilder haben verschiedene abmessungen und man weiß vorher nicht, welches bild geladen wird, die thumb-divs sollen eine feste größe haben und die images innerhalb der thumb-divs sollen horizontal wie auch vertikal zentriert werden.

    es geht nur mit html und css nichts serverseitiges und kein javascript.

    ich hab schon zig "tutorials" durch, aber keins fruchtet dabei..
    hat von euch noch jemand ne ahnung?

    edit: und kommt mir bitte nicht mit display:table und sowas.. des muss in ALLEN browsern richtig laufen... (okie6 isnich soo wichtig)
    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 !!!!!
    Geändert von synaptic (23.02.2011 um 19:04 Uhr)
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  2. #2
    König(in) Avatar von Grevas
    Registriert seit
    20.04.2009
    Ort
    In meiner Wohnung.
    Alter
    30
    Beiträge
    1.039
    Danke
    0
    Bekam 5 mal "Danke" in 5 Postings

    Standard AW: horizontale und vertikale zentrierung: verschiedene bilder in einem floatenden di

    Bitte sehr.
    HTML-Code:
    <div class="FRight thuWrap">
        <div class="thumb">
            <div>
                <div></div><img src="http://creditrepairhelpstore.com/wp-content/uploads/2010/08/bullet_point_50x50.gif" alt="" width="49" height="30" />
            </div>
        </div>
        <div class="thumb">
            <div>
                <div></div><img src="http://creditrepairhelpstore.com/wp-content/uploads/2010/08/bullet_point_50x50.gif" alt="" height="30" />
            </div>
        </div>
    </div>
    
    <style type="text/css">
    .thuWrap .thumb
    {
        width:49px;
        height:49px;
        border:1px solid lime;
        float:left;
        text-align:center;
        margin-right:12px;
        margin-bottom:12px;
    }
    
    .thuWrap .thumb img {
        display: inline-block;
        vertical-align: middle;
        text-align: center;
        line-height: 100%;
        background: #ccc;
    }
    .thumb div div {
        display: inline-block;
        width: 1px;
        height: 100%;
        margin-left: -1px;
        vertical-align: middle;
    }
    
    </style>
    Für IE6 muss man display: inline; benutzen.

  3. #3
    Forum Guru
    Themenstarter
    Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: horizontale und vertikale zentrierung: verschiedene bilder in einem floatenden di

    screenshot.4.png

    grevas, die idee is geil, aber funzt nich -.-
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  4. #4
    König(in) Avatar von Grevas
    Registriert seit
    20.04.2009
    Ort
    In meiner Wohnung.
    Alter
    30
    Beiträge
    1.039
    Danke
    0
    Bekam 5 mal "Danke" in 5 Postings

    Standard AW: horizontale und vertikale zentrierung: verschiedene bilder in einem floatenden di

    So, um das ganze so nicht stehen zu lassen: es funktioniert,
    was bei synaptic das Problem sein könnte lässt sich nicht feststellen, weil er kein code rausrückt

    Bei Nachfrage kann ich auch ein Link zu einer Seite schicken die diese Methode verwendet.

  5. #5
    Forum Guru
    Themenstarter
    Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: horizontale und vertikale zentrierung: verschiedene bilder in einem floatenden di

    ja das mit dem code rausrücken kann in manchen fällen fatale folgen haben
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

Ähnliche Themen

  1. vertikale zentrierung in tabellen
    Von Unregistriert im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 20.09.2009, 19:17
  2. verschiedene Skins für verschiedene Ordner einer Seite?
    Von tomrakete im Forum Zope & Plone - das deutsche Hilfeforum
    Antworten: 1
    Letzter Beitrag: 23.07.2007, 11:48
  3. Verschiedene Links in einem Bild möglich?
    Von AÖ-Ravenation im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 4
    Letzter Beitrag: 24.11.2006, 23:08
  4. 2 verschiedene Bilder/Banner abwechselnd anzeigen
    Von Gast im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 29.07.2006, 17:35
  5. Bilder in einem Posting?
    Von spinne im Forum Forum-Hilfe.de intern
    Antworten: 26
    Letzter Beitrag: 05.07.2003, 21:22

Stichworte

Berechtigungen

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