Corrigir largura de imagem no bootstrap - Carousel
Olá a todos,
Estou a aprender a trabalhar com o bootstrap. Acontece que num slide, através do carousel, a imagem não ocupa a largura toda a da página. Fica assim: https://imgur.com/a/MS03Y
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<!-- Primeiro Slide - Active -->
<div class="item active">
<img src="img/mountains.png">
<div class="carousel-caption">
<h1>get to know bootstrap</h1>
<br>
<button type="button" class="btn btn-default">Get Started</button>
</div>
</div> <!-- End Primeiro Slide - Active -->
<!-- Segundo Slide -->
<div class="item">
<img src="img/snow.png">
</div>
<!-- Terceiro Slide -->
<div class="item">
<img src="img/red.png">
</div>
</div>
Via CSS estou a tentar:
.item-active img {
background-size: cover;
}
Já estive a tentar de várias maneiras, mas nenhuma funciona. Através do Inspect Element consigo ver que a classe item tem a largura da página, mas a imagem, que está no inteiror dessa classe tem uma largura bem inferior à da página (o filho tem um largura inferior ao pai).
Obrigado pela ajudaDiscussão (1)
Carregando comentários...