title: Customize carousel with bootstrap 3
body: <p>I'm trying to customize the carousel of this template <a href="http://startbootstrap.com/templates/modern-business/" rel="nofollow">http://startbootstrap.com/templates/modern-business/</a>
  I need to insert the carousel inside the standard bootstrap 3 container class:</p>
  
  <pre><code>.container {
   padding-right: 15px;
   padding-left: 15px;
   margin-right: auto;
   margin-left: auto;
  } 
  </code></pre>
  
  <p>The problem is if I enter the carousel inside that class, it disappears, can not see anything...</p>
  
  <p>This is the code of the carousel:</p>
  
  <pre><code>&lt;div id="myCarousel" class="carousel slide"&gt;
    &lt;!-- Indicators --&gt;
      &lt;ol class="carousel-indicators"&gt;
        &lt;li data-target="#myCarousel" data-slide-to="0" class="active"&gt;&lt;/li&gt;
        &lt;li data-target="#myCarousel" data-slide-to="1"&gt;&lt;/li&gt;
        &lt;li data-target="#myCarousel" data-slide-to="2"&gt;&lt;/li&gt;
      &lt;/ol&gt;
  
      &lt;!-- Wrapper for slides --&gt;
      &lt;div class="carousel-inner"&gt;
        &lt;div class="item active"&gt;
          &lt;div class="fill" style="background-image:url('http://placehold.it/1900x1080&amp;text=Slide One');"&gt;&lt;/div&gt;
          &lt;div class="carousel-caption"&gt;
            &lt;h1&gt;Modern Business - A Bootstrap 3 Template&lt;/h1&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="item"&gt;
          &lt;div class="fill" style="background-image:url('http://placehold.it/1900x1080&amp;text=Slide Two');"&gt;&lt;/div&gt;
          &lt;div class="carousel-caption"&gt;
            &lt;h1&gt;Ready to Style &amp;amp; Add Content&lt;/h1&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="item"&gt;
          &lt;div class="fill" style="background-image:url('http://placehold.it/1900x1080&amp;text=Slide Three');"&gt;&lt;/div&gt;
          &lt;div class="carousel-caption"&gt;
            &lt;h1&gt;Additional Layout Options at &lt;a href="http://startbootstrap.com"&gt;http://startbootstrap.com&lt;/a&gt;&lt;/h1&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;!-- Controls --&gt;
      &lt;a class="left carousel-control" href="#myCarousel" data-slide="prev"&gt;
        &lt;span class="icon-prev"&gt;&lt;/span&gt;
      &lt;/a&gt;
      &lt;a class="right carousel-control" href="#myCarousel" data-slide="next"&gt;
        &lt;span class="icon-next"&gt;&lt;/span&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How can I solve this problem? Thanks</p>