Carousel resizing images (Oxygen theme and CPT Bootstrap Carousel)

Are you able to provide a link to the page where this is occurring? It would be helpful to be able to inspect the code.

Hi!!

Thanks for the reply! Yes, sorry, I had the “Coming soon” page because I am still building it, and there is content filled yet.

Here’s the link: https://www.lagaletonadebarcelona.com/

Thank you so much!!

Daniel.

I believe the Bootstrap.css file uses a class of .next by default during the transition of the carousel.

In your style.css, you also use a class of .next that you have set to a width of 40%.

Here’s the code:

.singular .next {
float: right;
width: 40%;
text-align: right;
}

If that is used for something else in the site you will probably want to change the class name, or remove the width:40%.

Also, if you pay close attention after removing the width:40% you will see a slight movement in the image. I believe this is being caused by a class of .left which is applying margin to the image during transition. Here is the code affecting this:

.left, .alignleft {
float: left;
margin: 0 15px 5px 0;
}

For both of these items you would need to change the class name in the style.css, and then update all instances where it occurs in the theme.

Thanks again TristinF! Good catch, overlapping CSS qualifiers can be tricky to find sometimes.. Has that worked phaedoland?

Yes!!

It finally did yesterday afternoon. Thank you so much for your quick reply, and your help.

I removed the float:left and now the carousel is smooth.

.left, .alignleft {
margin: 0 15px 5px 0;
}

Thanks again!!!!