Comment ajuster la hauteur du carrousel bootstrap?

Vous ne pouvez pas gérer le problème avec l'élément de carrousel actif. Vous pouvez essayer col-md-6 ou col-sm-12 au lieu de l'élément de carrousel actif. De cette façon, la hauteur sera auto-dimensionnée.

Vous devez utiliser

.carousel {
   min-height: 100%;
}

ou essayer d'utiliser

.carousel {
   min-height: auto;
}

Essayez d'utiliser viewheight,

.carousel{
    min-height: 100vh;
    height: 100vh;
}

Viewheight prend% de la vue de l'écran. 50vh signifie qu'il occupera 50% de votre écran. 100vh occupera 100% de votre affichage.

Ajoutez simplement la largeur: 100% sur votre balise de diapositive. Si vous utilisez bootstrap, utilisez la classe w-100 ou smth. Mais sachez que le référencement va vous botter le cul pour réduire des images comme ça, vous voudrez peut-être utiliser plusieurs images et les montrer en fonction de la taille de l'écran.

Bonjour, vous pouvez ajouter cette feuille de style que j'ai essayée dans votre site Web avec un élément d'inspection, c'est travaillé^!

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .carousel-inner {
    height: 400px;
}

.carousel-item, .carousel-item img {
    height: 400px;
  width:100%;
}

} 

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 767px) {
    .carousel-inner {
    height: 160px;
}

.carousel-item, .carousel-item img {
    height: 160px;
  width:100%
}
}

Voici le résultat