adjunto esta pregunta por que tengo una duda sobre algo que esta pasando en mi barra de navegacion y no le encuentro respuesta , adjunto una foto y parte del codigo para que puedan ver por su cuenta a ver si me pueden dar una idea
Es responsive mi navbar , la unica duda es que al jugar con los tamaños del navegador me encuentro esos casos donde queda cortada y trate de pensar el motivo no logro sacarlo
Desde ya muchas gracias gente Espero que entiendan la duda , cualquier cosa edito la publicacion
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-
fit=no" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>NEU - Nueva Editorial Universitaria</title>
<!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/img/favicon/cropped-logo-
32x32.webp" />
<link rel="icon" type="image/x-icon" href="assets/img/favicon/cropped-logo-
180x180.webp" />
<link rel="icon" type="image/x-icon" href="assets/img/favicon/cropped-logo-
192x192.webp" />
<link rel="icon" type="image/x-icon" href="assets/img/favicon/cropped-logo-
270x270.webp" />
<!-- Bootstrap icons-->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-
icons.css" rel="stylesheet" type="text/css" />
<!-- Google fonts-->
<link href="https://fonts.googleapis.com/css?
family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css" />
<!-- Core theme CSS (includes Bootstrap 5.1)-->
<link href="css/styles.css" rel="stylesheet" />
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
<!-- Font Awesome-->
<link href="/Public/assets/FontaWesome-6.0.0/css/all.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!--------------------------------------INICIO BARRA DE NAVEGACIÓN------------------------------------>
<div class="fixed-top" style="background-color: #30408B;">
<div class="container">
<div class="row">
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #30408B;">
<a class="navbar-brand" href="index.html" title="Inicio">
<img src="/Public/assets/img/logo1.webp" width="250" class="d-inline-block align-top pb-2" alt="Logo NEU">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarScroll" aria-controls="navbarScroll" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarScroll">
<ul class="navbar-nav">
<li class="nav-item active ms-5"><a class="nav-link" href="#" title="Inicio">INICIO</a></li>
<li class="nav-item ms-5"><a class="nav-link" href="institucional.html" title="Institucional">INSTITUCIONAL </a></li>
<li class="nav-item ms-5"><a class="nav-link" href="subSecretaria.html" title="SubSecretarÍa General">SUBSECRETARÍA</a></li>
<li class="nav-item ms-5"><a class="nav-link" href="catalogo.html" title="Catálogo">CATÁLOGO</a></li>
<li class="nav-item ms-5"><a class="nav-link" href="comercializacion.html" title="Comercialización">COMERCIALIZACIÓN</a></li>
</ul>
<div class=" row col-md-4 col-sm-8 d-flex ms-5">
<div class="col-2 pl-1 pl-2">
<a class="nav-redes" href="https://www.facebook.com/NEU-nueva-editorial-universitaria-347188832343695/" title="Facebook" target="_blank"><i class="bi-facebook fs-3"></i></a>
</div>
<div class="col-2 pl-1 pr-2">
<a class="nav-redes" href="https://twitter.com/NeuUnsl" title="Twitter" target="_blank"><i class="bi-twitter fs-3"></i></a>
</div>
<!--div class="col-4" style="margin: 0 0 0 0;">
<input class="form-control" id="myInput" type="text" placeholder="Buscador">
</div-->
</div>
</div>
</nav>
</div>
</div>
</div>
</body>
</html>