you need to make a smooth scrolling of news to the right, 3 news in a row. enter image description here

How to organize it?

<section> <div class="box_news"> <div id="gtco-main"> <div class="container"> <div class="row row-pb-md"> <div class="col-md-12"> <ul id="gtco-post-list"> <?php foreach ($countries as $country): ?> <li class="one-third entry animate-box" data-animate-effect="fadeIn"> <figure> <div class="entry-img" style="background-image: url(img/gallery-2.jpg"></div> </figure> <div class="entry-desc"> <h2 class="align-center top-title"> <p> <?= $country->title ?> </p> </h2> <div class="overflow-text-news"> <p1> <p class="border-left-news"> <?= $country->text ?> </p> </p1> </div> </div> <div class="box_bottom"> <?= Html::a('Читать далее', ['country/info', 'id' => $country->id]); ?> </div> <div class="box_bottom_date_posted"> <p><span class="date-posted">28.11.2018</span></p> </div> </li> <?php endforeach; ?> </ul> </div> </div> </div> </div> </section>

    1 answer 1

    You need to look towards the carousel , for example, like here - https://bootsnipp.com/snippets/featured/carousel-product-cart-slider , and adapt it to your needs.

    You can, of course, reinvent the wheel, but why?