JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
 <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
    <!-- Indicators -->
    
    <ol class="carousel-indicators">
      <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
      <li data-target="#carousel-example-generic" data-slide-to="1"></li>
      <li data-target="#carousel-example-generic" data-slide-to="2"></li>
    </ol>

    <!-- Wrapper for slides -->
    <div class="carousel-inner" role="listbox">

      
      <div class="item active">
        <img src="https://placeimg.com/1640/480/any">
        
        <div class="carousel-caption">
            <p>Title One</p>
        </div>     
      </div>
                    
      <div class="item ">
        <img src="https://placeimg.com/1640/480/any">

        <div class="carousel-caption">
            <p>Title Two</p>
            </div>

      </div>

 
      <div class="item ">
        <img src="https://placeimg.com/1640/480/any">

        <div class="carousel-caption">
            <p>Title Three</p>
        </div>
                
      </div>

      
    </div>

    <!-- Controls -->
    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
      <span class="sr-only">Next</span>
    </a>
  </div>

CSS

/*
.carousel-inner{
    height: 300px;
}


.item, img{
    height: 100% !important;
    width:  100% !important;
    border: 1px solid red;
}
*/

.carousel .item{
    height: 300px;
}

.item img {
    position: absolute;
    top: 0;
    left: 0;
    min-height: 300px;
}