.wrapper CSS изменит ширину моей bootstrap карты, но не высоту

Question

body {

padding-right: 30px;
padding-left: 30px;
padding-bottom: 30px;

background-color: #228B9D;

}

div.tron {
      padding-bottom: 40px;
    padding-right: 250px;
    padding-left: 250px;
}



.wrapper{
    width: 1000px;
    margin: 0 auto;


}

div.card-block {

padding-top: 15px;
padding-left: 15px;

}

   <div class="wrapper">
        <div class="container-fluid">
            <div class="card flex-row flex-wrap" >

             <img src="https://image.flaticon.com/icons/svg/1482/1482003.svg" alt="sop" style="background-color: #324A5E;">

        <div class="card-block">
            <h4 class="card-title">Title</h4>
            <p class="card-text">Description</p>

        </div>
        <div class="w-100"></div>
        <div class="card-footer w-100 text-muted">
             <a href="#" class="btn btn-primary">BUTTON</a>
        </div>
    </div>
        </div>
 </div>

Здравствуйте, я очень новичок в кодировании веб-страниц и, похоже, столкнулся с небольшой проблемой, которую не могу понять. Я пытаюсь изменить высоту моей карты с помощью CSS. Я установил ширину 1000px, и она работает просто отлично. однако, когда я ввожу высоту как 300px, это ничего не меняет с картой. есть ли причина, по которой можно изменить только ширину, а не высоту? дайте мне знать, если бы я должен был включить больше информации. спасибо!

Answer 1

Из того, что я могу понять, похоже, что некоторые из ваших div'ов выровнены неправильно, я переформатировал их и теперь могу изменить размер блока карты с высотой

посмотрите здесь: https://codesandbox.io/s/exciting-galileo-16u87

также в вашем css вам не нужен div.tron для класса, вы можете просто использовать .tron, дайте мне знать, если он все еще не работает, как вы хотел