Owlcarousel2: Owl Carousel is bigger than parent div and breaking the website

[citra45abadi]

followed the installation guide of Owl carousel and when I test it, the carousel is bigger than the parent div

the parent div is wrapping all of its child div into 85% width of the html body but owl carousel is stretching it into 2968px width

this is the example of problem here

[pascalporedda]

This is probably a problem on your site in general as it throws some javascript errors straight away.

[citra45abadi]

what errors? there isn't any errors related to owl carousel

all I can see is error of Google map API initmap

beside I use other jquery plugins and they runs just fine.

only owl carousel is like this.

please don't close the issue without trying to figure out the problem. well? there's this style element generated in div class='owl-stage' style='width : [Total width of all divs inside owl-carousel]'

now because I don't know how this style is generated in Jquery I ask you to tell how to make the owl-stage div fits the parent div, and make the rest of it hidden like with overflow : hidden

I tried adding overflow : hidden inside owl-stage class in CSS file but it does not fix the problem

[krystyna93]

I am having this same issue. Any ideas???

[AshrafTaha]

I had this issue once, and I found the solution:
make sure that the parent div (could be the section) have the following properties:
min-height: 50vh; /* you can adjust the minimum height for sure but dont't remove it /
height: auto; / this is important */
display: block;

[BrandonQDixon]

I am also having this issue. Has there been any fix?

[BowsDesign]

You may add a "overflow:hidden" to your parent div.

[jeffykle]

Using Bootstrap, simply putting it inside a <div class="container"> fixed it for me.