How to increase the size of carousel in materialize.css?

Question

I am trying to increase the size of carousel in materialize.css but couldn't get it. I have tried setting height but it didn't work. I googled it but couldn't find any solutions. Could anyone help me with this?

Answer 1

.carousel .carousel-item {
width:300px !important;}

this might help, place this code in your css and change width acording to your need.

Answer 2

Set a minimum height that correlates to the actual height of the images you want to include. For me, that was 900px.

.carousel { 
min-height: 900px;
}

Answer 3

after long trying, I figured out a solution that works for me:

.carousel .carousel-item>img {
    width: 230%; //there you set the width
    margin-left: -70%; //this is the centering of carousel (in original, it is a bit off to the right)
}

Hope it helps!

Answer 4

My carousel images were too big for the standard container. This is what I used, and my images are displaying perfectly now.

.carousel {
    height: 600px;
}