JSFiddle - React, Tailwind, and code Playground

by kkdaily

HTML

<div class="carousel">
  <div class="images-container">
    <img class="carousel-image" src="http://placekitten.com/300/200" />
    <img class="carousel-image" src="http://placekitten.com/300/200" />
    <img class="carousel-image" src="http://placekitten.com/300/200" />
  </div>
  <div class="carousel-controls">
    <
  </div>
</div>

CSS

.carousel {
  width: 90%;
  margin: auto;
  overflow: hidden;
  height: 200px;
}

.images-container {
  height: 100%;
  text-align: center;
  background: grey;
}

.carousel-image {
  height: 100%;
  display: inline-block;
}

JavaScript

let weewoo = document.querySelectorAll('.carousel-image');

weewoo = [...weewoo]

weewoo.forEach((woo) => {
	debugger;
})