Bootstrap Carousel Текстовый центр

Question

Я работаю с Bootstrap 3 и хочу использовать карусель для текстовых инструкций без img-фона. К сожалению, я не могу разместить текст в центре карусели. Он появляется всегда слева. Индикаторы идеально центрированы.

.leitbild-text{ 
    font-size: 2em; 
    line-height: 2em; 
    height: 5em; 
    display: table-cell; 
    vertical-align: middle 
} 

.leitbild-bg{ 
    background-color: #ededed; 
    margin: auto; 
    padding:auto; 
} 

.leitbild-item{ 
    background-color: red; 
}

<div class="row"> 
    <div class="col-md-12 col-sm-12 text-center leitbild-bg"> 

    <div id="leitbild-carousel" class="carousel slide" data-ride="carousel"> 
     <!-- Indicators --> 
     <ol class="carousel-indicators"> 
     <li data-target="#leitbild-carousel" data-slide-to="0" class="active"></li> 
     <li data-target="#leitbild-carousel" data-slide-to="1"></li> 
     <li data-target="#leitbild-carousel" data-slide-to="2"></li> 
     </ol> 

     <!-- Wrapper for slides --> 
     <div class="leitbild-carousel carousel-inner"> 
     <div class="item active leitbild-item"> 
      <p class="leitbild-text">Wir fördern die Leichtathletik im Allgemeinen und die Jugendarbeit im Speziellen.</p> 
     </div> 

     <div class="item leitbild-item"> 
      <p class="leitbild-text">Wir bieten Leichtathletiktrainings in sämtlichen Disziplinen und für alle Alters- und Leistungsstufen an.</p> 
     </div> 

     <div class="item leitbild-item"> 
      <p class="leitbild-text ">Wir fördern eine aktive Wettkampfteilnahme.</p> 
     </div> 

     <div class="item leitbild-item"> 
      <p class="leitbild-text">Wir pflegen die Kameradschaft und Geselligkeit.</p> 
     </div> 

     <div class="item leitbild-item"> 
      <p class="leitbild-text">Wir organisieren regelmässig Leichtathletikanlässe vereinsintern und auf kantonaler bis nationaler Ebene.</p> 
     </div> 

     <div class="item leitbild-item"> 
      <p class="leitbild-text">Wir stellen die notwendige Trainings-Infrastruktur zur Verfügung und bauen sie gezielt aus.</p> 
     </div> 

     <div class="item leitbild-item"> 
      <p class="leitbild-text">Wir fördern die Leichtathletik in der Region und arbeiten dazu eng mit den polysportiven Vereinen zusammen.</p> 
     </div> 

     <div class="item leitbild-item"> 
      <p class="leitbild-text">Wir fördern unsere Trainer durch gezielte Aus- und Weiterbildung.</p> 
     </div> 

     <div class="item leitbild-item"> 
      <p class="leitbild-text">Wir stellen eine gesunde Finanzierung des Vereins sicher.</p> 
     </div> 

     </div> 


    </div> 


    </div> 
</div>

Answer 1

попробовать это:

.leitbild-text{ 
    font-size: 2em; 
    line-height: 2em; 
    height: 5em; 
    display: table; 
    vertical-align: middle 
    margin:auto; 
} 

Answer 2

добавить следующий код CSS и увеличить отступы или добавить обивка-влево или вправо в зависимости от вас.

.carousel-caption{ 
    padding-bottom: 100px; 
} 

Это центр вашего текста на карусели.