Отрегулируйте карусель Bulma и изображение для маленьких экранов без пустого места везде - PullRequest
Новая
       37

Отрегулируйте карусель Bulma и изображение для маленьких экранов без пустого места везде

0 голосов
/ 28 марта 2020

Я создал веб-сайт с использованием фреймворка Bulma CSS для стилей. Я также использовал Bulma Carousel для текстовой карусели. Я использовал функцию колонки в Bulma, чтобы иметь карусель справа от изображения / видео. Это отлично работает на моем экране, но когда я открываю инспектор или вытаскиваю его на моем телефоне, изображения огромны, есть тонны пустого пространства, а на карусели нет точек или стрелок.

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

.slick-prev::before,
.slick-next::before {
  color: black !important;
}

html,
body {
  scroll-behavior: smooth;
}

video,
.imagePadding {
  padding-left: 50px;
}
    <section data-aos="fade-up" id="rendering" class="hero is-fullheight child">
      <div class="hero-body">
        <div class="container">
          <div class="content is-large">
            <h3>3D Rendering Projects</h3>
            <div class="columns is-vcentered">
              <div class="column is-7">
                <div class="3dCarousel">
                  <div class="item-1">There are</div>
                  <div class="item-2">things in here</div>
                  <div class="item-3">that I've removed</div>
                </div>
              </div>
              <div class="column">
                <img
                  class="imagePadding"
                  src="./images/render.png"
                  alt="Render"
                  width="5000vw"
                />
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>

С этим кодом я получаю ожидаемый результат на своем ноутбуке в полноэкранном режиме, но не на мобильном устройстве или с меньшим экраном. Это сбивает с толку, так как платформа Bulma делает несколько вещей на маленьких экранах, которые вызывают дополнительные промежутки между заголовком и каруселью.

Любая помощь для решения этой проблемы очень ценится.

...