показать один div рядом с предыдущей загрузочной каруселью div в мобильном устройстве - PullRequest
Новая
       55

показать один div рядом с предыдущей загрузочной каруселью div в мобильном устройстве

0 голосов
/ 25 сентября 2019

Мне нужен один слайд рядом с каждым слайдом, в основном это один общий элемент. Примерно так, как показано на изображениях.Я хочу показывать только один слайд на мобильном устройстве: у меня есть эта Карусель Bootstrap, которая показывает 2 div и один слайд каждый в режиме рабочего стола.Тем не менее, как я могу добиться этого? 

<div id="carouselExampleFade1" class="carousel slide" data-ride="carousel" data-interval="false">
<div class="carousel-inner">
    <div class="carousel-item">
        <div class="CEIFX-corporation-organization-content-wrap">
            <div class="CEIFX-corporation-organization-content-first-wrap">
                <div class="CEIFX-corporation-organization-content-img-wrap">
                    <div class="media">
                        <img src="images/clock.png" class="align-self-center mr-5" alt="/">
                        <div class="media-body">
                            <h5 class="">Less Time Spent on Managing Accounts, More Control On Your FX Balances </h5>
                        </div>
                    </div>
                    <ul class="CEIFX-corporation-organization-content-listing">
                        <li class="CEIFX-corporation-organization-content-listing-item">
                            <span class="font-weight-bold">View multi-currency account balances:</span> 24/7 access to view your holding account balances by currency.
                        </li>
                        <li class="CEIFX-corporation-organization-content-listing-item">
                            <span class="font-weight-bold">Generate account statements:</span> Clearly see your account activity whenever you want and export it for use outside of the system.
                        </li>
                        <li class="CEIFX-corporation-organization-content-listing-item">
                            <span class="font-weight-bold">Transfer between FX accounts:</span> Quickly move currency from one currency account to another in a few clicks.
                        </li>
                    </ul>
                </div>
            </div>
            <div class="CEIFX-corporation-organization-content-first-wrap">
                <div class="CEIFX-corporation-organization-content-img-wrap">
                    <div class="media">
                        <img src="images/cog.png" class="align-self-center mr-5" alt="/">
                        <div class="media-body">
                            <h5 class="">Streamline And Automate All FX Payments Easily</h5>
                        </div>
                    </div>
                    <ul class="CEIFX-corporation-organization-content-listing">
                        <li class="CEIFX-corporation-organization-content-listing-item">
                            <span class="font-weight-bold">Payment tracker:</span> Get the status of your international payment from entered to completed.
                        </li>
                        <li class="CEIFX-corporation-organization-content-listing-item">
                            <span class="font-weight-bold">Payment history:</span> View all or filter your results to see detailed summaries of your international payments and reprint past receipts.
                        </li>
                        <li class="CEIFX-corporation-organization-content-listing-item">
                            <span class="font-weight-bold">Send bulk payments:</span> Importing bulk international payments, multiple payment currency orders and multiple beneficiaries are supported, using our file
                            transfer facility. Simple CSV templates get your payments ordered without hassle.
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="carousel-item active">
        <div class="CEIFX-corporation-organization-content-wrap">
            <!-- Same Strcuture -->
        </div>
    </div>
    <div class="carousel-item">
        <div class="CEIFX-corporation-organization-content-wrap">
            <!-- Same Strcuture -->
        </div>
    </div>
</div>
<div class="carousel-control-wrap">
    <a class="carousel-control-prev" href="#carouselExampleFade1" role="button" data-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true">
            <img src="images/left-1.png" alt="/">
        </span>
    </a>
    <a class="carousel-control-next" href="#carouselExampleFade1" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true">
            <img src="images/right-1.png" alt="/">
        </span>
    </a>
</div>

фактический результат равен http://prntscr.com/pane1o

, и я хочу этот тип http://prntscr.com/panee7

нижний div - это следующий слайд первого div

...