Bootstrap 4 carousels do not respond to images

Question

Take a look at this: http://www.consultacultura.it/portale_comunale_della_cultura.asp?IDcomune=1

Carousel images do not respond like the images below it. They have the same img-fluid class.

Answer 1

This is a known issue in Bootstrap 4 Alpha 6 ...

https://github.com/twbs/bootstrap/issues/21611

As a workaround you can use ..

.carousel-item.active, .carousel-item-next, .carousel-item-prev { display: block; } 

http://www.codeply.com/go/0QUU06MiIL

Answer 2

For me, this workaround did not work for both desktop computers and mobile phones. I slightly adjusted the proposed workaround to make it clear.

 @media (orientation: portrait) { .carousel-item.active, .carousel-item-next, .carousel-item-prev { display: block; width:100%; height:auto; } } @media (orientation: landscape) { .carousel-item.active, .carousel-item-next, .carousel-item-prev { display: block; width:100%; height:96vh; } }