Bootstrap Carousel Text center

Question

i'm working with Bootstrap 3 and want to use the carousel for text-statements without img-background. Unfortunately I'm not able to place the text in the center of the carousel. It appears always on the left side. The indicators are perfectly centered.

.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

try this :

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