Это может быть простой вопрос для кого-то с хорошим знанием начальной загрузки, но я в тупике.
У меня есть «панель поиска», которая представляет собой ввод и кнопку в верхней части моей страницы, а затем строку с 4-строчными блоками внизу, так что я получаю панель поиска, которая охватывает всю ширину верхней части и затем элементы div с некоторым содержимым формируют 3 столбца.
Моя проблема в том, что строка поиска в верхней части экрана немного шире, чем три четырехстрочных блока. Кто-нибудь знает, как ограничить полосу поиска, чтобы она была такой же широкой, как три блока div? Я попытался просто изменить ширину, но это работает только при большем размере носителя. Мне нужно решение для начальной загрузки.
это не точная реализация, потому что на самом деле это реактивный проект, и некоторый контент генерируется динамически, но это проблема начальной загрузки, поэтому я пропускаю реактивный материал.
Вот код режима:
<div class="fluid-container">
<div class="row flex-xl-nowrap">
<div class="col-12 col-lg-9 py-md-3 pl-md-5 bd-content" role="main">
<div class="row">
<div class="col-md-12">
<div class="input-group mb-3">
<input type="text" class="form-control" placeholder="Recipient's username" aria-label="Recipient's username" aria-describedby="basic-addon2">
<div class="input-group-append">
<button class="btn btn-outline-secondary" type="button">Button</button>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
* some content *
</div>
<div class="col-md-4">
* some content *
</div>
<div class="col-md-4">
* some content *
</div>
</div>
</div>
</div>
</div>
любые предложения приветствуются
