Bootstrap 4 Carousel如何在slide和responsive中获取控件

Bootstrap 4 Carousel how to get controls in slide and responsive

我正在尝试弄清楚如何在幻灯片中获取控件并同时使其响应。我已将边距左右设置为适当的像素,以使其位于最佳位置,但是当我检查它是否响应时,它最终会根据分辨率出现在不同的位置。

这是我的代码 https://codepen.io/andysaurusrex/pen/roPmOq

HTML

  <div>
    <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
          </a>
  </div>
  <div>
    <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
          </a>
  </div>
</div>

CSS

.carousel-inner img {
    margin: auto;
}
/* .carousel-control-prev {
    margin-left: 425px;
}

.carousel-control-next {
    margin-right: 425px;
} */

有什么办法可以解决这个问题吗?

提前致谢

.carousel-inner img {
  max-width: 100%;
}
.carousel {
  max-width: 800px;
  margin: 0 auto;
}

...会做到的。笔:https://codepen.io/andrei-gheorghiu/pen/JwxJKb