Hallo alle zusammen,

zur zeit bin ich dabei einen Slider zu programmieren, beim styling bin ich allerdings auf einige Probleme gestoßen, an denen ich nicht weiterkomme:
wie muss ich den Code verändern, damit die Bilder nebeneinander dargestellt werden und aufgrund des overflow: hidden; nicht angezeigt werden? Der Code ist unter https://jsfiddle.net/bernhein/227d9r5a/1/ auffindbar.


Vielen Dank im Vorraus

Kleine Hilfestellung:

Du brauchst einen äußeren Container, der eine festgelegte Breite hat, z.B. 100%. Mit overflow: hidden sorgst du dann dafür, dass nichts angezeigt wird, was über diese Breite hinausgeht.

Darin wiederum brauchst du einen Container, der so breit ist, dass alle Bilder nebeneinander passen. Angenommen du hast 5 Bilder, alle 100% breit, dann braucht dieser Wrapper eine Breite von 500%. Dank overflow:hidden des vorigen Containers sieht man aber nur ein Bild.

Die Bilder bzw. <li>-Elemente stellst du dann mit float: left nebeneinander dar.