Оставшееся пространство справа для небольших устройств (мобильных устройств) - PullRequest
0 голосов
/ 01 ноября 2019

При просмотре на экране ноутбука справа не остается свободного места, и для просмотра содержимого нет необходимости прокручивать вправо. Но когда я посмотрел то же самое для более мелких (мобильных) устройств, с правой стороны осталось место, и есть полоса прокрутки для прокрутки вправо, что мне не нужно.

PFB код с возникающей проблемойблок нижнего комментария:

<!-- ========== MAIN CONTENT ========== -->
    <main id="content" role="main">

        <!-- Career Title Section -->
        <div class="container space-top-1 space-top-md-4">
            <div class="position-relative">
                <!-- Title -->
                <div class="w-md-80 w-lg-70 text-center mx-md-auto">
                    <div class="mb-4">
                        <h2 class="h1 text-primary font-size-md-down-3"> <span class="font-weight-semi-bold">Photo
                                Gallery</span>
                        </h2>
                        <p class="text-dark">View the pictures
                        </p>
                    </div>
                </div>
                <!-- End Title -->
            </div>
        </div>
        <!-- End Career Title Section -->


        <!-- FAQ Topics Section -->
        <div class="space-0 space-md-2  pl-2 pr-2 pl-lg-9 pr-lg-9">
            <div class="row">
                <div class="col-md-2 mb-7 ">
                    Content 1 Card will be populated here
                </div>

                <div class="col-md-10">
                    Content 2 Card will be populated here
                </div>
            </div>
        </div>
        <!-- End FAQ Topics Section -->


    </main>
    <!-- ========== END MAIN CONTENT ========== -->

PFB скриншоты на меньшем устройстве, имеющем место справа. enter image description here

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

<!-- ========== MAIN CONTENT ========== -->
    <main id="content" role="main">

        <!-- Career Title Section -->
        <div class="container space-top-1 space-top-md-4">
            <div class="position-relative">
                <!-- Title -->
                <div class="w-md-80 w-lg-70 text-center mx-md-auto">
                    <div class="mb-4">
                        <h2 class="h1 text-primary font-size-md-down-3"> <span class="font-weight-semi-bold">Photo
                                Gallery</span>
                        </h2>
                        <p class="text-dark">View the pictures
                        </p>
                    </div>
                </div>
                <!-- End Title -->
            </div>
        </div>
        <!-- End Career Title Section -->


        <!-- FAQ Topics Section -->
        <div class="container space-0 space-md-2  ">
            <div class="row">
                <div class="col-md-2 mb-7 ">
                    Content 1 Card will be populated here
                </div>

                <div class="col-md-10">
                    Content 2 Card will be populated here
                </div>
            </div>
        </div>
        <!-- End FAQ Topics Section -->


    </main>
    <!-- ========== END MAIN CONTENT ========== -->

PFB снимок экрана на экранах меньшего размера (мобильный): enter image description here

Какое решение может быть для этого. Как можно убрать пространство, идущее справа, чтобы исчезнуть. Заранее спасибо !!

...