Элементы карусели не помещаются в div

<div class="carousel"> 
    <div class="col s12 m6 carousel-item"> 
      <div class="card"> 
        <div class="card-image"> 
          <img src="https://materializecss.com/images/sample-1.jpg"> 
          <span class="card-title">Card Title</span> 
        </div> 
        <div class="card-content"> 
          <p>I am a very simple card. Some text here, ololololo. Yep, a little bit more</p> 
        </div> 
        <div class="card-action"> 
          <a href="#">This is a link</a> 
        </div> 
      </div> 
    </div> 
 
<!--И еще пару раз то же самое--> 
  </div>

 $(document).ready(function(){ 
    $('.carousel').carousel(); 
  });