私のカルーセルの高さと幅をパーセントで設定する方法については本当に混乱しています

Question

私のカルーセルの幅を画面の幅の100％を占めるように設定しようとしていますが、高さは画面の35％トップ。私は高さで％を使用する試みを数多く試しましたが、うまく動作しません。

これは私のCSSです：私は、カルーセルは画面の35％を取るにしたいので、私はPXまたはEMを使用したくない理由

html,body{ 
    height: 100%; width: 100%; margin: 0; 
} 

.carousel-slide, .carousel-image, .carousel-inner{ 
    height: 35%; 
    width: 100%; 
} 

/*carousel-image is the class for the images placed in the carousel*/ 

理由にかかわらず、デバイスのウェブサイトが使用されています（デスクトップブラウザ、ipad、スマートフォン...）

ありがとうございます。

Answer 1

代わりに、ビューポートの高さとビューポートの幅を100とし、それが機能するかどうか試してみてください。

.carousel-slide, .carousel-image, .carousel-inner{ 
    height: 35vh; 
    width: 100vw; 
}