Мне нужна помощь, чтобы переместить панель навигации вправо, так как строка не использует всю ширину от родительского div (контейнера).
Также мне нужно сделать изменяемый размер панели навигации на экранах меньшего размера, и когда появляется кнопка для отображения скрытой панели навигации, после нажатия на нее отображается меню справа (в настоящее время отображается посередине).
Я уже пытался использовать классы pl-5 ml-5, которые предоставляет bootstrap 4, для перемещения панели навигации, но, похоже, эти классы не решают проблему.
Я уже проверил, что добавление большего количества контента (текста, ссылок, li и т. Д.) В эти строки увеличивается.
Текущее состояние сайта:
https://demos.posicionart.com/silleri/
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<nav class="navbar navbar-expand-lg navbar-light bg-light pb-0">
<div class="container">
<div class="row">
<div class="col-4 col-lg-4 ml-0">
<a class="navbar-brand" href="#">
<img src="images/landing/silieri-logo-head.png" class="d-inline-block align-top" alt="Imagen Logo Header Silieri">
</a>
</div>
<div class="col-8 col-lg-8">
<div class="row">
<p class="text-right navbar-header-footer">
<b class="welcome-title-header">Qro.</b> (442) 223 6825 | (442) 183 055 | (442) 183 1940 | <b class="welcome-title-header">León</b> (447) 432 0949 <i class="fab fa-facebook fa-lg"></i> <i class="fab fa-whatsapp fa-lg"></i> CONTÁCTANOS
</p>
</div>
<div class="row">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto mr-auto">
<li class="nav-item pb-1 pt-1 pl-2 pr-2">
<a class="nav-link" href="#">Proyectos</a>
</li>
<li class="nav-item pb-1 pt-1 pl-2 pr-2">
<a class="nav-link" href="#">Especiales</a>
</li>
<li class="nav-item pb-1 pt-1 pl-2 pr-2">
<a class="nav-link" href="#">Catálogo</a>
</li>
<li class="nav-item pb-1 pt-1 pl-2 pr-2">
<a class="nav-link" href="#">Guía</a>
</li>
<li class="nav-item pb-1 pt-1 pl-2 pr-2">
<a class="nav-link" href="#">Cotizador</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</nav>
Я просто хочу переместить навигационную панель вправо и сделать ее отзывчивой, поскольку я впервые использую подобную навигационную панель, а не ту, которая используется по умолчанию при загрузке 4.