Bootstrap 4 Карусель выравнивания и управления - PullRequest
Новая
       34

Bootstrap 4 Карусель выравнивания и управления

0 голосов
/ 04 декабря 2018

Я изо всех сил пытаюсь выровнять элементы управления каруселью и текст.Перепробовал много вещей, но до сих пор не могу понять это.Как вы можете видеть на изображении элементы управления расположены слишком близко к внутреннему тексту.

  1. как переместить левый / правый элемент управления к краям?
  2. как изменить ширину текста div?(я попробовал w-75, но затем весь текст был смещен влево)

спасибо!

enter image description here

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

            <!-- Wrapper for slides -->
            <div class="carousel-inner " role="listbox">
              <div class="carousel-item  active style="width:100%">

                <div class="d-flex h-100  align-items-center justify-content-center p-5" >
                  <h1>Do you know if your dog advisor is a sales guy ? Do you know if your dog advisor is a sales guy ?  
                      Do you know if your financial advisor is a sales guy or is truly represents yours best interest?
                  </h1>
                </div>
              </div>
              <div class="carousel-item">
                <div class="d-flex h-100 align-items-center justify-content-center p-5">
                  <h1>Do you know if your dog advisor is a sales guy ? Do you know if your dog advisor is a sales guy ?</h1>
                </div>
              </div>
              <div class="carousel-item">
                <div class="d-flex h-100 align-items-center justify-content-center p-5">
                  <h1>Do you know if your dog advisor is a sales guy ? Do you know if your dog advisor is a sales guy ?</h1>
                </div>
              </div>
            </div>

            <!-- Left and right controls -->
            <a class="carousel-control-prev" href="#myCarousel"  data-slide="prev">
                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
              <span class="sr-only">Previous</span>
            </a>
            <a class="carousel-control-next" href="#myCarousel"  data-slide="next">
              <span class="carousel-control-next-icon" aria-hidden="true"></span>
              <span class="sr-only">Next</span>
            </a>


          </div>
...