JSFiddle - React, Tailwind, and code Playground

HTML

<div class="mySlides">
  <img src="http://i.imgur.com/nKoVqZO.jpg">
  <p id="caption">blah blawlhekjr kwjehr kwjehr kwjehr kw kqwjh wk kj hkwehr kwjehr kwejrh wk kw jherkw kwh rdfkhsdkjf ksjdfhk sjdhf k ksjhfks jdhfk js skjdhfk sjdhfkj sdhfk skdjfhksdjfh ksdhf ksdjhfksjdhfkjsh kshdfksjdhfkjs hdf ksjhdfksjh fksh skdfh ksjdhfk sj skdfh
    ksdjfh skskj dhfskjd hfksd</p>
</div>

CSS

.mySlides {
  display: flex;
  flex-direction: column;
  width: 75%;
  margin: 0 auto;
}

.mySlides img {
  width: 100%;
  max-height: 70vh;
}

#caption {
  text-align: center;
}