How to align subtitle text on the right in a carousel bootstrap?

Question

I want to align the subtitle text tweeter-bootstrap-carousel on the right. How can i do this?

<div class="carousel-inner">
    <div class="item active">
        <img src="img/img1.png" alt="" class="img-responsive">
        <div class="carousel-caption right-caption">
            This is the text I want to put on the right.
        </div>
     </div>
 </div>

Answer 1

try wrapping the text with the text on the right.

<div class="carousel-inner">
    <div class="item active">
        <img src="img/img1.png" alt="" class="img-responsive">
        <div class="carousel-caption right-caption text-right">
            This is the text I want to put on the right.
        </div>
     </div>
</div>

Answer 2

Just if I can give a deeper understanding of this:

Adding text-rightto a div carousel-captionwill not work, because for carousel-captionthere is a current CSS style with text alignment for

.

This CSS block appears AFTER text-rightthe Bootstrap-style class, so adding text-rightdoes not cancel the style carousel-caption.

, , , text-left, text-center text-right !important, , -.

- CSS carousel-caption.

.carousel-caption {
    text-align: right;
}

---

text-right , CSS:

.carousel-caption.text-right {
    text-align: right;
}