JSFiddle - React, Tailwind, and code Playground

HTML

<div id="similar_offers_rotator_id">
    <div class="similar_offers_arrow" id="similar_offers_left_arrow_id"></div>
    <div class="similar_offers_arrow" id="similar_offers_right_arrow_id"></div>
    <div id="similar_offer_items_cont_mask_id">
        <div id="similar_offer_items_cont_id">
        <ul>
            <li>
                <div class="sim_offer_item">
                    <img src="img/simrotator/example.png">
                    <a href="javascript:">Какая-то детская обертяйка, я бы со..</a>
                    <p class="sim_price_p">234р<span class="grey_text"> /шт.</span></p>
                    <div class="rating_stars similar_items_rating_stars rating7"></div>
                </div>
            </li>
            <li>
                <div class="sim_offer_item">
                    <img src="img/simrotator/example.png">
                    <a href="javascript:">Какая-то детская обертяйка, я бы со..</a>
                    <p class="sim_price_p">234р<span class="grey_text"> /шт.</span></p>
                    <div class="rating_stars similar_items_rating_stars rating7"></div>
                </div>
            </li>
            <li>
                <div class="sim_offer_item">
                    <img src="img/simrotator/example.png">
                    <a href="javascript:">Какая-то детская обертяйка, я бы со..</a>
                    <p class="sim_price_p">234р<span class="grey_text"> /шт.</span></p>
                    <div class="rating_stars similar_items_rating_stars rating7"></div>
                </div>
            </li>
            <li>
                <div class="sim_offer_item">
                    <img src="img/simrotator/example.png">
                    <a href="javascript:">Какая-то детская обертяйка, я бы со..</a>
                    <p class="sim_price_p">234р<span class="grey_text"> /шт.</span></p>
                    <div class="rating_stars similar_items_rating_stars rating7"></div>
                </div>
            </li>
     ...

CSS

#similar_offers_rotator_id {
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;    
	box-sizing: border-box;
	position: absolute;
	width: 745px;
	overflow: hidden;
	bottom: 20px;
	left: 0;
	right: 0;
	margin: auto;
	padding-top: 70px;
	margin-top: 70px;
	overflow: visible;
	/*background-color: #929292;*/
}

.similar_offers_arrow {
	width: 13px;
	height: 22px;
	position: absolute;
	cursor: pointer;
	cursor: hand;
	top: 0;
	bottom: 0;
	margin-top: auto;
	margin-bottom: auto;
}
.similar_offers_arrow:hover {
	background-position: -13px;
}

#similar_offers_left_arrow_id {
	left: 0;
	background-image: url("../img/simrotator/sim_cont_left_arrow.png");
	background-repeat: no-repeat;
}
#similar_offers_right_arrow_id {
	right: 0;
	background-image: url("../img/simrotator/sim_cont_right_arrow.png");
	background-repeat: no-repeat;
}

#similar_offer_items_cont_mask_id {
	overflow-x: scroll;

}
#similar_offer_items_cont_id {
	width: 1375px;
}
#similar_offer_items_cont_id ul {
	display: inline-block;
	list-style: none;
	padding: 0;
	margin: 0;
	float: left;
}

#similar_offer_items_cont_id li {
	float: left;
    list-style: none;    
	margin: 0px;
	padding: 0px;
	letter-spacing: 0;  
	display: inline-block;  
	width: auto;
	height: auto;
	top: 0px;
}

.sim_offer_item {

	position: relative;
	margin-right: 1px;
	overflow: hidden;
	padding: 0;
	width: 174px;
	height: 250px;
	clear: right;
	float: left;
	margin: 0;
	top: 0;
	border-right: 1px solid #d2d2d2;
	cursor: pointer;
	cursor: hand;
}
#similar_offer_items_cont_id li:last-child .sim_offer_item {
	border-right: none;
}