How to make all images the same size in slideshow

HTML & CSS
1

http://www.posweyb.net/
Thanks to you guys I finally got the timing and overlay the way I want it on the slideshow. My images are all different sizes and resolutions…I have tried several things to get the images to be the same size-none of which worked.

Is it possible to define one class that does this?

Right now they all look like this.

  <div class="mySlides fade">
    <div class="numbertext">1 / 3</div>
    <img src="images/Sienna.jpg" alt="An Italian Dandy with a Ferret" style="width:100%">
<div class="text"></div>
  </div>

  <div class="mySlides fade">
    <div class="numbertext">2 / 3</div>
    <img src="images/banner.jpg" alt=" A bunch O Monkeys " style="width:100%">
    <div class="text"></div>
  </div>

  <div class="mySlides fade">
    <div class="numbertext">3 / 3</div>
    <img src="images/Van_Eyck.jpg" alt="What A Big Sleeve You Have" style="width:100%">
    <div class="text"></div>
  </div>
</div>
</section>

<!-- End of slide Show to rotate automatically -->```
2

Hi there posweyb,

the images need to have the same resolution.
In you case, this meant the cropping of height.

Check the attachment to see the 3 images.

posweyb.zip (339.7 KB)

coothead

3

This link may be of interest:

1 Like
4

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.