nicht angemeldet
Hi Leutz!
Ich suche und suche und finde einfach keine Lösung zu meinem Problem.
Wie kann man (wie bei Tabellen) den DIV-Container dynamisch mit dem Inhalt wachsen lassen? Mein Problem ist, ich würde gerne ein Forum in meiner Seite includen. Wenn jemand jetzt aber ein grösseres Bild in die Seite einfügt, soll diese aber, statt fest auf 760 Pixel zu sein, etwas breiter werden bis das Bild hineinpasst. Mit Tabellen ging sowas noch. Man hat der Tabelle eine Breite von 760 px gegeben und sie wurde automatisch grösser, wenn man grosse Bilder drinne hatte.
Ich habe mir mal die Mühe gemacht und etwas Code geschrieben, damit ihr euch mein Problem vielleicht etwas besser verdeutlichen könnt. Bilder sprechen nun mal mehr als tausend Worte. Einfach folgenden Quellcode in einem Browser darstellen:
---------------------------------------------------
<html>
<head>
<style type="text/css">
#box1 { background-color: aaaaaa; margin-top:20px; }
#box2 { background-color: aaaaaa; margin-top:20px; min-width:700px; }
#box3 { background-color: aaaaaa; margin-top:20px; max-width: 700px; }
#box4 { background-color: aaaaaa; margin-top:20px; width: 700px; }
</style>
</head>
<body>
Ich würde gerne, dass der DIV-Container sich wie eine Tabelle verhält. Ich gebe ihm eine feste Breite, aber wenn ein Bild mit drinnen ist welches grösser ist, soll er dynamisch grösser werden (das tut er nur im IE) und sich der Breite des Bildes anpassen.
<div id="box1">Wenn ich keine Formatierung zugebe, dann ist die Box so breit wie das Fenster.
<br />
<img src="#" alt="irgendein Bild mit 1600 Pixel Breite" height="32" width="1600" border="0" />
</div>
<div id="box2">Hier eine Box mit Mindestbreite 700 Pixel. Die Breite geht ebenfalls auf das volle Fenster.<br />
<img src="#" alt="irgendein Bild mit 1600 Pixel Breite" height="32" width="1600" border="0" />
</div>
<div id="box3">Hier eine Box mit einer Maximalbreite von 700 Pixel, da hält er sich penibel dran. <br />
<img src="#" alt="irgendein Bild mit 1600 Pixel Breite" height="32" width="1600" border="0" />
</div>
<div id="box4">Hier eine Box mit einer Breite von 700 Pixel, auch hier kein abweichen von der Breite. <br />
<img src="#" alt="irgendein Bild mit 1600 Pixel Breite" height="32" width="1600" border="0" />
</div>
Wie ihr nun im Mozilla seht, geht das Bild aus dem DIV-Container und der Container bleibt in der Grösse.
</body>
</html>
---------------------------------------------------
Mir liegt wirklich viel an der Lösung dieses Problems. Danke auf jeden Fall für jeden Tipp den ich kriege.!
Greetz
Scheich Xodox