Aswin Aswin - 29 days ago 9
CSS Question

I need to fix the carousel to a specific size and the images to fit inside the carousel

I need to fix the carousel to a specific size and the images to fit inside it. There is no problem in mobile view, but on computers the images fill the screen and then I have to scroll down to see the carousel indicators. What should I do?

CSS Code:

.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
display: block;
height: auto;
max-width: 100%;
line-height: 1;
margin: auto;
width: 100%;
}

Answer

if its not full width slider u shouuld put ur slider inside col or container see code below for ref

if its full width slider put it inside container-fluid

img{
  max-width: 100%;
}

<div class="container">
 <div class="row">
   <div class="col-md-12">
     ur carousel code should be here
   </div>
  </div>
</div>

and if ur using full width container

<div class="container-fluid">
 <div class="row">
   <div class="col-md-12">
     ur carousel code should be here
   </div>
  </div>
</div>
Comments