Why does the owl carousel display the slide incorrectly?

Question

JavaScript

<div class="owl-carousel">
    <img1>
    <img2>
    <img3>
</div>

the .owl-carousel block has a width of 1267px.
Further:

$('.owl-carousel').owlCarousel({
        items: 1
    });

And the slider calculates the width of one slide (.owl-item) at 1250px, because of which a piece of the next picture crawls out. How to fix?

Answer 1

The problem is probably in your styles
https://codepen.io/anon/pen/OEgmqR

Answer 2

I advise you to generally avoid sliders that set any height or width for elements. This immediately puts an end to adaptability and the use of a slider without any crutches.