Как исправить проблему с заполнением в Bootstrap 5?

#html #css

Вопрос:

Отступ сверху вниз установлен на 3%, но отступ слева направо 15% не работает. Может кто-нибудь объяснить, что здесь не так? Я хочу установить заполнение сверху вниз в размере 3% и заполнение слева направо в размере 15% в соответствии с контейнером для жидкости. Но, похоже, что отступ слева направо не работает. Я отладил его с помощью инструментов разработчика chrome. Но отступ слева направо был зачеркнут.

 <div class="container-fluid">
  <div class="navbar navbar-expand-lg navbar-dark">
    <a class="navbar-brand" href="">Tindog</a>    
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo01" aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarTogglerDemo01">
        <ul class="navbar-nav ms-auto">
            <li class ="nav-item">
                <a class="nav-link" href="">Contact</a>
            </li>
            <li class ="nav-item">
                <a class="nav-link" href="">Pricing</a>
            </li>
            <li class ="nav-item">
                <a class="nav-link" href="">Download</a>
            </li>
        </ul>   
    </div>
  </div>





  <!-- Title -->

  <div class="row">
    <div class="col-lg-6 col-md-6">
      <h1>Meet new and interesting dogs nearby.</h1>
      <button type="button">Download</button>
      <button type="button">Download</button>
    </div>
    <div class="col-lg-6 col-md-6">
      <img src="images/iphone6.png" alt="iphone-mockup">
    </div>
  </div>
</div>
 

ФАЙЛ CSS

 .container-fluid{
padding: 3% 15%;}
 

Комментарии:

1. Он зачеркнут из-за специфики , а размеры указаны специально. Если вы переопределите его чем-то подобным padding: 3% 15% !important , это окажет негативное влияние на ваш макет. Подумайте margin вместо этого или padding о дополнительном содержащем элементе и выберите модель коробки снаружи, чтобы сохранить макет, который вам, вероятно, нужен.