Grafische Links nebeneinander in einem Div

Beitrag von **bydlo** » 18.10.2008, 14:41

moin moin,
steh grade mal wieder CS-mäßig auf dem Schlauch.

Ich möchte gerne mehrere Bilder nebeneinander in einem Div aufrufen.
Diese Bilder beeinhalten alle einen link.

der HTML-Code:

<div id="gal">
<a class="wmp" href="https://localhost/kam2/fotos-mittel/fla ... .jpg"><img src="fotos-mittel/flamme-fatale/1.jpg" alt="" width="136" height="150" /></a>
<a class="wmp" href="https://localhost/kam2/fotos-mittel/fla ... .jpg"><img src="fotos-mittel/flamme-fatale/3.jpg" alt="" width="145" height="150" /></a>
<a class="wmp" href="https://localhost/kam2/fotos-mittel/fla ... .jpg"><img src="fotos-mittel/flamme-fatale/2.jpg" alt="" width="171" height="150" /></a>
<a class="wmp" href="https://localhost/kam2/fotos-mittel/fla ... .jpg"><img class="image" src="fotos-mittel/flamme-fatale/5.jpg" alt="" width="140" height="150" /></a>
</div>

Das CSS:

Code: Alles auswählen

#gal &#123;
	width&#58;1000px;
	
&#125;
#gal img &#123;
	padding&#58;10px;
	border&#58;1px solid #000000;
	background&#58;#ECE7D7;
	display&#58; inline;	
&#125;

Das rgebnis:
Sie stehen amlinken rand der seite untereinander stat nebeneinander.

Kann mir mal jemand auf die sprünge helfen?
Bin schon eine Weile am rumprobieren.
Gruss axel

von **Anzeige von ABAKUS** »

Beitrag von **guppy** » 18.10.2008, 15:05

>display: inline;

wird nicht von allen browsern richtig interpretiert, vielleicht liegt es daran - ohne es jetzt weiter geprüft zu haben, erinnerre ich mich, dass ich da auch mal Probleme mit hatte, Ich glaube FF oder orera kennen die CSS Weisung nicht und ignorieren dann einfach.

Beitrag von **turgay** » 18.10.2008, 16:44

Vielleicht:

Code: Alles auswählen

float&#58; left;

bydlo hat geschrieben:Kann mir mal jemand auf die sprünge helfen?

von **Anzeige von ABAKUS** »

SEO Consulting bei ABAKUS Internet Marketing
Erfahrung seit 2002

persönliche Betreuung
individuelle Beratung
kompetente Umsetzung

Jetzt anfragen: 0511 / 300325-0.

Beitrag von **Mork vom Ork** » 18.10.2008, 23:24

bydlo hat geschrieben:Ich möchte gerne mehrere Bilder nebeneinander in einem Div aufrufen.

[…]
#gal img {
padding:10px;
border:1px solid #000000;
background:#ECE7D7;
display: inline;
}

Das rgebnis:
Sie stehen amlinken rand der seite untereinander stat nebeneinander.

Wenn man davon absieht, dass die Angabe display:inline für <img>-Elemente überflüssig ist, weil <img>-Elemente von Haus aus inline-Elemente sind, funktioniert der Code hier tadellos wie du möchtest (mit und natürlich auch ohne display:inline).

Beitrag von **Mork vom Ork** » 18.10.2008, 23:25

guppy hat geschrieben:>display: inline;

wird nicht von allen browsern richtig interpretiert […] Ich glaube FF oder orera kennen die CSS-Weisung nicht und ignorieren dann einfach.

Das meinst du jetzt nicht ernst.

Beitrag von **Automatisierter** » 19.10.2008, 00:42

Code: Alles auswählen

#gal &#123;
   width&#58;722px;
   margin&#58; 0 auto;
   text-align&#58;center;
   &#125;
   
#gal img &#123;
   padding&#58;0 10px 0 0;
   border&#58;1px solid #000;
   height&#58; 150px;
   background&#58;#ECE7D7;
   &#125;

Code: Alles auswählen

<div id="gal">
	<a class="wmp" href="http&#58;//localhost/kam2/fotos-mittel/flamme-fatale/1.jpg"><img src="fotos-mittel/flamme-fatale/1.jpg" alt="1" width="136px" /></a>
	<a class="wmp" href="http&#58;//localhost/kam2/fotos-mittel/flamme-fatale/3.jpg"><img src="fotos-mittel/flamme-fatale/3.jpg" alt="2" width="145px" /></a>
	<a class="wmp" href="http&#58;//localhost/kam2/fotos-mittel/flamme-fatale/2-gross.jpg"><img src="fotos-mittel/flamme-fatale/2.jpg" alt="3" width="171px" /></a>
	<a class="wmp" href="http&#58;//localhost/kam2/fotos-mittel/flamme-fatale/5.jpg"><img class="image" src="fotos-mittel/flamme-fatale/5.jpg" alt="4" width="140px" /></a>
</div>