Изображение выскакивает из div при просмотре на мобильном телефоне Bootstrap 4 - PullRequest
0 голосов
/ 21 декабря 2018

У меня есть изображение, которое выпрыгивает из его div, когда я просматриваю веб-сайт на моем телефоне ... на некоторых телефонах это okej, но не на samsung galaxy note 9 для примера.Я пытался сделать все возможное, чтобы этого не случилось, и не смог повернуть правильный ключ.Я использую загрузчик 4. Я использовал медиа-запросы, но он не работает.

Проверьте изображение здесь

    <section id="showcase" class="">
    <div class="primary-overlay text-white">
        <div class="container">
            <div class="row">
                <div class="col-sm-6 text-center">
                    <h1 class=" display-2 mt-5 pt-5">Alla företag på ett och samma ställe
                    </h1>
                    <div>



                        <p class="mb-0 lead">För dig som privatkund är Kyndia en app som ger dig tillgång samt
                            information
                            om de företag du har att göra med. Allting i en och samma app.</p>
                        <br>


                        <p><em>Enkelt organiserat och helt gratis.</em></p>


                    </div>


                    <button type="button" class="btn btn-dark">
                        <i class="fab fa-apple"></i> Hämta i Appstore</button>
                    <a href="#news" class="btn btn-success" role="button"><i class="fas fa-envelope"></i> Prenumerera </a>

                </div>

                <div class="col-sm-6 text-center">
                    <img src="img/Start.png" alt="" class="img-fluid wow bounceInRight d-sm-block">
                    <!--d-none och d-lg-block-->
                </div>
            </div>
        </div>
    </div>
</section>

Ответы [ 2 ]

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

Вот это КСС

#showcase {
    position: relative;
    min-height: 100vh;


}

#showcase h1 {
    font-size: 80px;
}

#showcase .primary-overlay {
    background: #149db9;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

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

Попробуйте использовать свойство Max-Width в CSS.

Если вы хотите расширить его до полной ширины области просмотра или контейнера, используйте это

max-width: 100%
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...