title: Bootstrap carousel resizing image
body: <p>Hi I am trying to make a carousel on my wordpress website with bootstrap. I would like to put four block links next to it. I have the blocks there and the images are scrolling fine, However I believe the carousel is changing the height of the image.</p>
  
  <p>I have images (640 x 360) and I made the 4 blocks 90 pixels high. I did this so the blocks would be flush with the bottom of the carousel. Except the blocks are too big. I don't understand what the problem could be. And I have searched through all of the CSS.</p>
  
  <p>Here is my code:</p>
  
  <pre><code>&lt;!--==========================================--&gt;
  &lt;!-- Carousel                                 --&gt;
  &lt;!--==========================================--&gt;
  &lt;div&gt;
      &lt;div id="myCarousel" class="carousel slide"&gt;
          &lt;div class="carousel-inner"&gt;
  
              &lt;!--Carousel item 1--&gt;
              &lt;div class="item active"&gt;
                  &lt;img src="http://localhost:6054/wp-content/themes/BLANK-Theme/images/material/ej-manuel.png" alt="buffalo-skyline" width="640" height="360" /&gt;
                  &lt;div class="carousel-caption"&gt;
                      &lt;h4&gt;First Thumbnail label&lt;/h4&gt;
                          &lt;p&gt;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.&lt;/p&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  
              &lt;!--Carousel item 2--&gt;
              &lt;div class="item"&gt;
                  &lt;img src="http://localhost:6054/wp-content/themes/BLANK-Theme/images/material/image3.jpg" width="640" height="360" /&gt;
                  &lt;div class="carousel-caption"&gt;
                      &lt;h4&gt;Second Thumbnail label&lt;/h4&gt;
                          &lt;p&gt;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.&lt;/p&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  
              &lt;!--Carousel item 3--&gt;
              &lt;div class="item"&gt;
                  &lt;img src="http://localhost:6054/wp-content/themes/BLANK-Theme/images/material/images.jpg" alt="the-buzz-img3" width="640" height="360" &gt;
                  &lt;div class="carousel-caption"&gt;
                      &lt;h4&gt;Third Thumbnail label&lt;/h4&gt;
                      &lt;p&gt;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.&lt;/p&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  
          &lt;/div&gt;
          &lt;a class="left carousel-control" href="#myCarousel" data-slide="prev"&gt;‹&lt;/a&gt;
          &lt;a class="right carousel-control" href="#myCarousel" data-slide="next"&gt;›&lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;!--==========================================--&gt;
  &lt;!-- Side Buttons                             --&gt;
  &lt;!--==========================================--&gt;
  &lt;div&gt;
      &lt;ul class="nav nav-tabs nav-stacked"&gt;
          &lt;li&gt;&lt;a style="background-color: #051223; color: #fff; height: 90px; width: 210px;"&gt;Story 1&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a style="background-color: #051223; color: #fff; height: 90px; width: 210px;"&gt;Story 1&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a style="background-color: #051223; color: #fff; height: 90px; width: 210px;"&gt;Story 4&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a style="background-color: #051223; color: #fff; height: 90px; width: 210px;"&gt;Story 5&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>