Donate. I desperately need donations to survive due to my health

Get paid by answering surveys Click here

Click here to donate

Remote/Work from Home jobs

Need help to fix bootstrap carousel height

on

I am using vanilla bootstrap 3 carousel. The only custom css that I use is this:

.carousel-caption {
    position: relative;
    left: auto;
    right: auto;
    margin-top: -50px;
    background-color: #000;
     opacity: 0.8;
}

The annoying issue is that when the images are of different heights, the carousel height expands and causes the text below to jump, which is not desirable. I have tried differnt css tricks, like adding:

.carousel-inner{
  width:100%;
  max-height: 600px !important;
}

and some other suggestions that I found on other SO answers but none worked for me. So I appreciate your help.

Comments

Post a Comment