Slider on bootstrap?

Question

css

Good day.
An interesting question is how to make the slider smaller in size and so that the image is centered.
Here is my code.
The slider is standard from bootstrap.

<div class="ones">
    <div id="carousel" class="carousel slide">
        <!--Индикаторы слайдов-->
        <ol class="carousel-indicators">
            <li class="active" data-target="#carousel" data-slide-to="0"></li>
            <li data-target="#carousel" data-slide-to="1"></li>
            <li data-target="#carousel" data-slide-to="2"></li>
        </ol>
        
        <!--Слайды-->
        <div class="carousel-inner">
            <div class="item active">
                <img src="images/wm_cover.png" alt="">
                <div class="carousel-caption">
                    <h3></h3>
                    <p></p>
                </div>
            </div>
            <div class="item">
                <img src="images/wm_cover.png" alt="">
                <div class="carousel-caption">
                    <h3></h3>
                    <p></p>
                </div>
            </div>
            <div class="item">
                <img src="images/wm_cover.png" alt="">
                <div class="carousel-caption">
                    <h3></h3>
                    <p></p>
                </div>
            </div>
        </div>

        <!--Стрелки переключения слайдов-->
        <a href="#carousel" class="left carousel-control" data-slide="prev">

        </a>
        <a href="#carousel" class="right carousel-control" data-slide="next">
        
        </a>
    </div>
</div>

It works, but the bastard is very high: www.nskmobile.ru
here is a demo of the site. Understand what I'm talking about.

Answer 1

#carousel {
    height: auto;
...
}

Answer 2

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 250px;
}