How can I make my carousel fully responsive?

Hi, I used a drag-and-drop application to try to create websites and I realize that Bootstrap 4 beta carousel does not fit the images and its height changes from one image to another. I want my carousel to fit all screen sizes. Here is an image of what the other application does without any code. It fits the images, shows the center of the image but does not change the ratio. Could someone please help me to write right codes? I will appreciate. Regards

Fully responsive carousel

https://www.dropbox.com/s/px79elgxsv456iu/carousel.JPG?dl=0 Here is the image of what I want.

After a long research, I found a solution (I used only the carousel in the studio): .d-block.w-100 { height:100vh; width:auto; object-fit:cover; }

If there is a problem with this code, please let me know.

"Carousels don’t automatically normalize slide dimensions. As such, you may need to use additional utilities or custom styles to appropriately size content."

https://getbootstrap.com/docs/4.0/components/carousel/#example

Saj