Bulma CSS отзывчивость не работает с Bulma Carousel или изображениями - PullRequest
Новая
       42

Bulma CSS отзывчивость не работает с Bulma Carousel или изображениями

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

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

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

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

.carousel {
  overflow: hidden;
}
<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>Title Here</h3>
            <div id="columns is-vcentered">
              <div class="column is-7">
                <div class="3dCarousel">
                  <div class="item-1">
                    Item 1
                  </div>
                  <div class="item-2">
                    Item 2
                  </div>
                  <div class="item-3">
                    Item 3
                  </div>
                </div>
              </div>
              <div class="column">
                <figure class="image is-16by9">
                  <img
                    src="./images/render.png"
                    alt="Render"
                  />
                </figure>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>

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

...