icon scrollbar nur eine Zeile

[KunmingDirk]

Hallo,
Ich brauche wiedermal eure Hilfe.

Ich programmiere gerade mein erste slideshow.

hierher möchte ich
in einer flachen , in der Breite und Höhe begrenzten, div
viele icons in [B]NUR einer Zeile[/B] darstellen ,
und weil die div begrenzt ist und es sehr viele icons sind
soll man horizontal scrollen können.

Mein Problem ist,
das ich es nicht schaffe, das es nur eine Zeile bleibt.

hier ein Auszug aus meinem Fehlversuch:

[code=html]
<style>
#slidebar img
{
float:left;
margin:2px;
vertical-align:middle;
}
</style>

<div id="slidebar" style="height:110px;width:400px;
overflow-x:scroll;overflow-y:hidden;
border-style:solid;border-width:1px;border-color:black; " >

<img src="./pictures/before-after 6 beers rotated-icon.jpg" style="" alt="">
<img src="./pictures/all03-icon.png" style="" alt="">
<img src="./pictures/eyesonly-cut-wide-icon.png" style="" alt="">
<img src="./pictures/KunmingD-oval-01a-icon.png" style="" alt="">
<img src="./pictures/image-50062-galleryV9-ogdh-icon.jpg" style="" alt="">
<img src="./pictures/image-446540-galleryV9-iodm-icon.jpg" style="" alt="">
<img src="./pictures/HBrJwrp6_Pxgen_r_700xA-icon.jpg" style="" alt="">
<img src="./pictures/HBrJwrp6_Pxgen_r_700xA-icon.jpg" style="" alt="">
<img src="./pictures/HBrJwrp6_Pxgen_r_700xA-icon.jpg" style="" alt="">
<img src="./pictures/HBrJwrp6_Pxgen_r_700xA-icon.jpg" style="" alt="">

</div>
[/code]

Cheers,
Dirk

[Paul]

Moin.

Versuch's mal ohne float:left und dafür mit white-space:nowrap; im div.

Gruß,
Paul

[Matthias Apsel]

Om nah hoo pez nyeetz, KunmingDirk!

zusätzlich noch folgende Hinweise:

Div ist kein semantisch passendes Element. figure ist passender. Packe sämtliche Styleangaben in eine eigene Ressource. Verwende border statt der Einzeleigenschaften.

Matthias

[KunmingDirk]

Danke für die Tipps,

figure kenne ich noch nicht.

Später werde ich die styles in eine extra Datei auslagern.
Die sind jetzt nur drin um es bei denn paar Zeilen Code "übersichtlicher/einfacher/verständlicher" zu machen.

das selbe gilt fuer border

ich suche, gerade in diesem Moment, in einem andern window, eine deutsche Beschreibung  von figure
und werde es auf jeden Fall ausprobieren

nochmals vielen Dank,
Dirk

[KunmingDirk]

Danke für die Hilfe,

"float:left" raus
und
"white-space:nowrap;" ins style von der div

Es funktioniert!

nochmals Danke,
Dirk