Andreas Diner: Viele Bilder nebeneinander positionieren.

Ich probier jetzt schon eine ganze weile rum und bin mit CSS eigentlich recht fit, aber ich bekomme es einfach nicht hin und kann im Internet auch keine Lösung finden.

Wie schaffe ich es, viele Bilder innerhalb eines divs, immer nebeneinander zu positionieren. Mit float funktionier es leider nicht, da dann ja die Bilder wenn sie nicht mehr nebeneinander in's Browserfenster passen wieder teilweise untereinander dargestellt werden. Sie sollen aber immer nebeneinander angeordnet sein. Wenn nicht mehr alle in das Browserfenster passen soll der horizontale Scrollbalken erscheinen.

Das HTML könnte dazu ungefähr so aussehen:
<div>
   <img src="bild1.jpg />
   <img src="bild2.jpg />
   <img src="bild3.jpg />
   ...
   <img src="bildn.jpg />
</div>

Ich hoffe mir kann Jemand helfen.

  1. <div>
       <img src="bild1.jpg />
       <img src="bild2.jpg />
       <img src="bild3.jpg />
       ...
       <img src="bildn.jpg />
    </div>

    Schreibe zwischen die <img> keine Leerzeichen und keinen Zeilenumbruch.

    <div>
      <img src="bild1.jpg /><img src="bild2.jpg /><img src="bild3.jpg />
    </div>

    LG Kalle

    1. Schreibe zwischen die <img> keine Leerzeichen und keinen Zeilenumbruch.

      Vielen Dank für den  Tipp, aber so funktioniert es leider nicht. Wenn die Bilder nicht mehr nebeneinander in's Browserfenster passen, werden sie wieder umgebrochen und genau das will ich ja nicht haben.

      1. Schreibe zwischen die <img> keine Leerzeichen und keinen Zeilenumbruch.

        Vielen Dank für den  Tipp, aber so funktioniert es leider nicht. Wenn die Bilder nicht mehr nebeneinander in's Browserfenster passen, werden sie wieder umgebrochen und genau das will ich ja nicht haben.

        Wundert mich. Aber dann gibt es noch die Tabellenzeile und jedes Bild steht in einem eigenen <td>. Das _kann_ nicht umgebrochen werden.

        1. Hi Kalle_B,

          Wundert mich. Aber dann gibt es noch die Tabellenzeile und jedes Bild steht in einem eigenen <td>. Das _kann_ nicht umgebrochen werden.

          Wie kommst du darauf?

          <div>
             <img src="bild1.jpg />
             <img src="bild2.jpg />
             <img src="bild3.jpg />
             ...
             <img src="bildn.jpg />
          </div>

          Wenn dann könnte der OP das ganze in ein <pre> packen.

          Grüße aus H im R,
          Engin

          1. Hi,

            Wenn dann könnte der OP das ganze in ein <pre> packen.

            white-space:pre reicht auch.

            cu,
            Andreas

            --
            Warum nennt sich Andreas hier MudGuard?
            O o ostern ...
            Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
            1. coll "white-space:pre"  ist genau das was ich gesucht habe. So bleibt das HTML  schön sauber und ich muss keinen dummen Layouttabellen verwenden.
              Vielen leiben Dank MudGuard

  2. Hi!

    So ganz CSS gefestigt bist du aber dann doch nicht, was? Probier mal
    http://de.selfhtml.org/css/eigenschaften/ausrichtung.htm#white_space