overflow: hidden; warum werden nicht alle Bilder in einem "versteckt"?

[Idn]

Guten Tag liebe Community,

ich bin dabei einen Slider zu bauen und leider "versteckt" sich nur ein Bild in einem. Das dritte Bild bleibt wie schon davor nur in seine Position. Liegt das eventuell an dem <img>

beim ersten <img> picture1.jpg.jpg

beim zweiten <img> picture2.jpg.jpg

beim dritten <img> o233-ai4Q4-unsp.jpg -> Hier ganz anderer Name

Welche Lösungen gibt es für dieses Problem ?

Hier der wichtigste (Teil-)Code:

Der Code bei CSS:

.Slider{

width: 800px;

height: 500px;

overflow: hidden;

}

body {

margin: 0;

padding: 0;

height: 100vh;

display: flex;

justify-content: center;

align-items: center;

background-color: white;

}

HTML-Code (ein Teil):

<div class="Slider">

<div class="Slides">

<input type="radio" name="radio-btn" id="radio1">

<input type="radio" name="radio-btn" id="radio2">

<input type="radio" name="radio-btn" id="radio3">

<div class="slidefirst">

<img src="picture1.jpg.jpg" alt="" width="160" height="145"/>

</div>



<div class="slidesecond">

<img src="picture2.jpg.jpg" alt="" width="160" height="145"/>

</div>



<div class="slidethird">

<img src="o233-ai4Q4-unsp.jpg" alt="" width="160" height="145"/>

</div>



<div class="navigation auto">



<div class="auto-btn-1"></div>

<div class="auto-btn-2"></div>

<div class="auto-btn-3"></div>

</div>

 

[Werner123]

Zeige einen Code, mit dem sich das nachvollziehen lässt. Und Code fügt man nicht so einfach ins Forum, verwende die Code-Tags.