Responsive Bild

04/09/2014 09:32 Seraphius#1
Guten Tag miteinander

Ich benötige eure fachkräftige Unterstützung.
Über Google habe ich keine passende Lösung erhalten :/

Die Situation sieht so aus:
  • Bild mit 100% Breite
  • Automatische Höhe
  • Content soll sich der Höhe des Bildes anpassen (also wenn die Höhe des Bildes kleiner wird, soll der Content nach oben "rutchen"

Die Strukturierung bis jetzt:
HTML Code:
<div id="cycle-wrapper">
    <div id="cycle">
        <img></img>
    </div>
</div>
Der CSS-Code:
#cycle-wrapper {
position: relative;
max-width: 100%;
}

#cycle {
width: 100%;
height: inherit;
}

#cycle img,
#cycle div {
max-width: 100%;
height: auto;
}


Die Website: [Only registered and activated users can see links. Click Here To Register...]

Wie Ihr seht, skaliert, das Bild in der Breite, da dies aber nicht proportional geschieht (höhe skaliert nicht mit), wird das Bild zusammengedrückt.

Ich hoffe, jemand von euch kann mir dabei helfen, dies zu beheben :)
04/09/2014 16:53 kissein#2
Code:
#cycle{
position: relative;
width: 1382px;
height: auto !important;
padding-bottom: 50px;
}

<div id="cycle-wrapper">
    <div id="cycle">
        <div  style="display:block"><img></div> //erste bild
        <div  style="display:none"><img></div> //folge bilder

    </div>
</div>