Bilder mit Titel

[mm]

Hallo,

Ich habe das Problem, dass bei mir ´die erste Zeile in Ordnung ist, dort werden 3 Bilder nebeneinander angezeigt (so will ich es auch). In der nächsten Zeile wird nur 1 Bild rechts und dann darunter 2 Bilder links und mittig angezeigt. Wie kann ich erreichen, dass in jeder Zeile 3 Bilder in gleicher Höhe nebeneinander angezeigt werden?
Fehler tritt nur beim IE 8 auf. Opera und Firefox zeigen alles richtig an.
Woran liegt das? Was muss ich ändern?

mime

folgender Code:
in CSS-Datei:

  
dl.gallery  
{  
border: 0px solid #000;  
background-color:  
width: 180px;  
text-align: center;  
padding: 5px;  
float: left;  
margin-right: 0em;  
}  
  
.gallery dt { font-weight: bold; }  
  
.gallery dt img  
{  
border: 0px solid #000;  
width: 160px;  
height: 120px;  
}  
  
.gallery dd  
{  
margin: 0;  
padding: 0;  
}

xthml1.0:

  
<dl class="gallery">  
<dt><a href="bild1.php" ><img src="thumbs/bild1.png" alt="bild1.png" /> </a></dt>  
<dt>test</dt>  
<dd>text</dd>  
</dl>  
<dl class="gallery">  
<dt><a href="bild2.php" ><img src="thumbs/bild2.png" alt="bild2.png" /> </a></dt>  
<dt>test</dt>  
<dd>text</dd>  
</dl>  
<dl class="gallery">  
<dt><a href="bild3.php" ><img src="thumbs/bild3.png" alt="bild3.png" /></a></dt>  
<dt>test</dt>  
<dd>text</dd>  
</dl>  
<dl class="gallery">  
<dt><a href="bild4.php" ><img src="thumbs/bild4.png" alt="bild4.png" /> </a></dt>  
<dt>test</dt>  
<dd>text</dd>  
</dl>  
<dl class="gallery">  
<dt><a href="bild5.php" ><img src="thumbs/bild5.png" alt="bild.png" /> </a></dt>  
<dt>test</dt>  
<dd>text</dd>  
</dl>  
<dl class="gallery">  
<dt><a href="bild6.php" ><img src="thumbs/bild6.png" alt="bild6.png" /></a></dt>  
<dt>test</dt>  
<dd>text</dd>  
</dl>  
  

[Gunnar Bittersmann]

@@mm:

nuqneH

folgender Code:

Ich habe
1. keine Lust,
2. nicht deine Bilder,
3. eine Glaskugel, die mir sagt, dass 'display: inline-block' besser als 'float' wäre.

Qapla'

[bleicher]

Grüße,

1. keine Lust,

ich würde mich sogar bereit erklären, entsprechende Anleitung zu schreiben^^ die frage nur - wohin damit^^

MFG
bleicher

[mm]

vielen Dank für die Antworten!

@ Gunnar Bittersmann
1. ich kann doch eine nicht fuktionierende Seite nicht ins Internet stellen.
2. meine Bilder braucht man doch nicht unbedingt
3. werde display: inline-block mal ausprobieren, wenn ich hin bekomme

@ bleicher
Danke für das Angebot der Anleitung. Wie meinst du ^^ die frage nur - wohin damit^^. Kannst du das nicht ins Forum schreiben?

[Malcolm Beck´s]

مرحبا

ich kann doch eine nicht fuktionierende Seite nicht ins Internet stellen.

Wer sagt'n sowas? Ich habe Seiten Online gestellt und verlinkt, die ich noch nicht mal angefangen hatte. Ich habe für den Fall aller Fälle das grosse Fragezeichen, welches sich direkt hinter „Wen Juckt's?“ befindet. Und wenn's jemanden geben sollte, den es juckt, juckt es dann dich, dass es den anderen juckt? Also mich juckt gar nichts ...

Richte eine Subdomain zum testen ein und gut ist, denn ohne Bilder ist es Anstrengend, Nachzuvollziehen, woran es bei dir Harpert. Oder baue ein Bsp., in dem statt der Bilder einfach CSS-Container die Maße der Bilder haben, damit man es schnell Debuggen kann. Wenn ich dein Bsp. bei mir Lokal aufrufe, sind die Fehlenden Bilder unter Umständen für andere Darstellungsfehler verantwortlich, die wiederum vom eigentlichen Problem abweichen und Zeit kosten.
Je Leichter du es uns machst, den Fehler zu finden, desto schneller kannst du weiter machen.

mfg

[mm]

hier ist der link zur testseite: www.dominik-meier.de/bilder.php

die Bilder sollten nebeneinander und der text darunter dargestellt sein.

mm

[Malcolm Beck´s]

مرحبا

hier ist der link zur testseite: www.dominik-meier.de/bilder.php

Sieht doch Ok aus.

die Bilder sollten nebeneinander und der text darunter dargestellt sein.

Versuche es mal, wie der Gunnar schon schrieb, mit display:inline-block; (die neue Wunderwaffe), statt dem float für die <dl>. Wenn die IE-Degubbar nicht täuscht, dann sollte das dein Problem lösen.
Hat den Nebeneffekt, dass du die dl-Elemente mit einem einfachen text-align zentrieren kannst.

mfg

[mm]

Danke für die Hilfe,

mit display:inline-block; funktioniert es!

mm