Guten Tag allerseits,
ich habe folgendes Problem:
Für eine Bildergalerie möchte ich im oberen Drittel der Seite eine Horizontale Vorschau der Bilder (Thumbnails). Der Rahmen dieser Vorschau soll ca. 90% der Bildschirmbreite einnehmen. Es soll möglich sein, bei Überlauf horizontal weiterzuscrollen.
Aber: ICH KRIEGS NICHT HIN!!!
Hier mal mein Code:
<nav>
<div id="thumbnail">
<a href="#bild1"><img src="bilder/thumbnails/1-thumb.jpg" width="320" height="240" alt="Bild1" title="Bild1" /></a>
<a href="#bild2"><img src="bilder/thumbnails/2-thumb.jpg" width="320" height="240"alt="Bild1" /></a>
<a href="#bild3"><img src="bilder/thumbnails/3-thumb.jpg" width="320" height="240"alt="Bild1" /></a>
<a href="#bild4"><img src="bilder/thumbnails/4-thumb.jpg" width="320" height="240"alt="Bild1" /></a>
<a href="#bild5"><img src="bilder/thumbnails/5-thumb.jpg" width="320" height="240"alt="Bild1" /></a>
</div>
</nav>
Der Style dazu:
#thumbnail {
border: 5px solid green;
margin: 0px;
padding: 0px;
width: 1200px; /*Nur zum Test, könnte auch 90% heißen */
height: 300px;
background-color: black;
overflow-x: scroll;
}
#thumbnail a {
color: white;
background-color: black;
}
#thumbnail img {
float: left;
width: 320px;
height; 240px;
overflow: auto;
}
Was mache ich falsch?
Viele Grüße,
Michael
