CODEWITHSUNDEEP
jquerycsstwitter-bootstrap
Dr.Avalanche
Dr.Avalanche

Reputation: 1996

Bootstrap - carousel - Remove additional space

Using carousel I have a carousel as follows:

<!-- TEST carousel --> 
<div id="TESTcarousel" class="hero-unit carousel slide"> 
    <div class="carousel-inner"> 
        <div class="item active"> 
            .........
        </div> 
        <div class="item"> 
            .........
        </div> 
        <div class="item"> 
            .........
        </div> 
    </div><!-- .carousel-inner --> 

<!--  next and previous controls here 
          href values must reference the id for this carousel --> 
  <a class="carousel-control left" href="#TESTcarousel" data-slide="prev">&lsaquo;</a> 
  <a class="carousel-control right" href="#TESTcarousel" data-slide="next">&rsaquo;</a> 
</div><!-- .carousel -->

It renders as:

Example render

I'd like to remove some of the additional space in the purple area, the padding. How do I achieve this?

Thanks in advance

Upvotes: 0

Views: 490

Answers (1)

Lipis
Lipis

Reputation: 21835

Remove the hero-class because this is the one that is adding the paddings.

In the latest carousel (and in the old one if I'm not mistaken) there is no much padding actually and it looks like you're using Bootstrap 2.

Upvotes: 1

Related Questions