5 Bilder nebeneinander positionieren - wie?

[javanizer]

Hallo,

um mein Problem zu lösen, habe ich neben Selfhtml und diesem Forum diverse deutsche und englischsprachige css seiten durchforstet aber leider hab ich keine lösung gefunden oder vielleicht hab ich auch einfach irgendwann den durchblick verloren.

darum stelle ich meine frage jetzt einfach mal hier - vielleicht bekomme ich ja eine antwort die mir wirklich weiter hilft.

ich möchte 5 fotos nebeneinander positionieren alle haben unterschiedliche breiten aber die gleiche höhe und zwischen jeden muss ein weisser trennstrich von 1px breite sein.

mein problem ist, dass das ganze im IE so aussieht wie es soll, aber im forefox eben nicht, da sind die bilder alle nach links verschoben und die weissen trenner sind nicht zu sehen.

ich weiss, dass der firefox der standardtreuere browser ist und der ie eigentlich der mit den bug ist aber wie bekomme ich es hin, dass alle fotos in einer reihe stehen und in allen browsern der weisse trenner zu sehen ist?

ich könnte ja in die tabellensteinzeit zurückkehren aber das ganze layout ist css basiert und nur der mist klappt nicht so wie er soll.

für jede konstruktive hilfe dankbar

gruß
javanizer

[dey]

Hallo,

und wie hat er das wohl gemacht?
Tippen sie hier!
Oder posten sie den Code oder die Url.

bydey

[Zeromancer]

Hallo javanizer,

ich möchte 5 fotos nebeneinander positionieren alle haben unterschiedliche breiten aber die gleiche höhe und zwischen jeden muss ein weisser trennstrich von 1px breite sein.

  
<img src="" width="" height="" alt="" title="" />  
<img src="" width="" height="" alt="" title="" />  
<img src="" width="" height="" alt="" title="" />  
<img src="" width="" height="" alt="" title="" />  
<img src="" width="" height="" alt="" title="" />  

  
img {  
  width:auto;  
  display:block;  
  float:left;  
  border-left:1px solid #fff;  
}  

mein problem ist, dass das ganze im IE so aussieht wie es soll, aber im forefox eben nicht, da sind die bilder alle nach links verschoben und die weissen trenner sind nicht zu sehen.

Wie sieht denn dein Vorschlag aus?

Mit freundlichen Grüßen,
André

[javanizer]

hi

ok warum einfach wenn auch kompliziert nicht geht.
manchmal sollte man wirklich einfach mal einfach denken.

ok wie ich daran gegangen bin:
ich hab jedes bild in ein div mit fixen abmaßen gepackt und dann relativ zum übergeordneten element pixelgenau positioniert. float hatte ich auch drin aber dann wurde es kompliziert. einen quellcode kann ich nicht ambieten, weil ich keine hab der funktionierte....

ich teste das jetzt mal.... :-)
auf jeden fall schon mal vielen dank...

gruß
javanizer

[Zeromancer]

Hallo javanizer,

ich teste das jetzt mal.... :-)

und?

Mit freundlichen Grüßen,
André

[MudGuard]

Hi,

ich möchte 5 fotos nebeneinander positionieren alle haben unterschiedliche breiten aber die gleiche höhe und zwischen jeden muss ein weisser trennstrich von 1px breite sein.

Gegenvorschlag:

  
<img src="" width="" height="" alt="" title="" /><img src="" width="" height="" alt="" title="" /><img src="" width="" height="" alt="" title="" /><img src="" width="" height="" alt="" title="" /><img src="" width="" height="" alt="" title="" />  

  
img { border-left:1px solid #fff; }  

Bilder sind per se inline-Elemente - es gibt also wenig Grund, sie zu block-Elementen zu machen und dann zu floaten.

(Whitespace sollte dann aber nicht zwischen den Bildern sein - oder man muß mit word-spacing experimentieren, dazu ggf. auf monospace setzen und dann word-spacing:-1em - bei word-spacing mit Längenangabe wird auf den normalen Wortabstand addiert )

cu,
Andreas

[Zeromancer]

Hallo MudGuard,

Gegenvorschlag:

klingt plausibel. ;-) Frohes Fest.

Mit freundlichen Grüßen,
André