Bom dia!
Fiz tudo conforme a aula , porém tem algum erro que não estou conseguindo identificar que esta dando diferença no meu projeto. As setas do carrossel não estão aparecendo e as imagens estão uma em baixo da outra. Alguém pode me ajudar a encontrar o erro?
<section class="carrossel">
<h2 class="carrossel__titulo">Novos lançamentos</h2>
<!-- Slider main container -->
<div class="swiper">
<!-- Additional required wrapper -->
<div class="swiper-wrapper">
<!-- Slides -->
<div class="swiper-slide"><img src="./assets/ApacheKafka.svg" alt="Livro sobre apache kafka e spring boot da alura books "></div>
<div class="swiper-slide"><img src="./assets/Liderança.svg" alt="Livro sobre liderança e design da alura books"></div>
<div class="swiper-slide"><img src="./assets/Javascript.svg" alt="Livro sobre javascript da alura books"></div>
<div class="swiper-slide"><img src="./assets/ReactNative.svg" alt="Livro sobre react native da alura books"></div>
<div class="swiper-slide"><img src="./assets/Gestão.svg" alt="Livro sobre gestão da alura books"></div>
<div class="swiper-slide"><img src="./assets/Gestão2.svg" alt="Livro sobre gestão 2 da alura books"></div>
</div>
<div class="swiper-pagination"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
<div class="swiper-scrollbar"></div>
</div>
</section>
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
<script>
const swiper = new Swiper('.swiper', {
spaceBetween: 10,
slidesPerView: 3,
});
</script>
</body>
</html>
)
