CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
lowcoupling
lowcoupling

Reputation: 2169

how to change caption's position in twitter bootstrap

I'd like to have the caption of a bootstrap carousel at the bottom, with black background as wide as the browser. like this http://freebiesdesign.com/wp-content/uploads/2012/10/boostrap-carousel.jpg

how should I do that?

Upvotes: 2

Views: 175

Answers (1)

Cyzanfar
Cyzanfar

Reputation: 7136

Considering you already have a Bootstrap carousel working you could do something like this:

<div class="item">
    <img src="yourimagebackground" alt="">
       <div class="container">
         <div class="carousel-caption">
            <p> your caption here</a>
         </div>
       </div>
</div>

To set the background of your caption you could do this in your css

.carousel-caption {
position: absolute;
right: 0;
bottom: 0;
left: 0;
padding: 15px;
background: rgba(0, 0, 0, 0.75);
}

Here, background: rgba(0, 0, 0, 0.75); will set the background of the caption to a transparent black color. If you want it completely black you can just replace it by background: black; that's up to you!

Upvotes: 1

Related Questions