Carousel - how to adjust the position of controls and indicators?

Hi forum,

How to adjust the location, or position, of the prev and next controls, as well as the indicators this carousel?
I’ve tried using the “Move” tool, but I can’t get either to move from their positions. I’m assuming because the controls are locked?

Screenshot 2024-03-05 162056

I’m guessing that my form inputs are in the space that a carousel would typically have a “background” image take up.

First choice - How to move the controls and indicators out more to where the red pointers are showing? Basically, just outside the “Slide” divs?

Second choice - If that’s not possible because of some BSS constraint, how then to make the form input fields closer together so that they all fall inside of were the immovable controls and indicators are located?

Thank you.

You can try with this

CSS

.carousel-inner {
  padding: 2rem;
  margin: auto;
}

.carousel-indicators {
  margin-bottom: 0;
}

.carousel-control-next, .carousel-control-prev {
  width: 2rem;
}

1 Like

Yes, this worked perfectly!

Thanks again, I appreciate it.

1 Like