0

Soy muy nueva en todo esto y he estado buscando en Bootstrap pero encuentro la solución a que no se mueva el alto de la navbar pero sea responsive

Cuando estoy en "Ver Usuarios" el logo se ve perfectamente , también en "Opiniones" o en el Home (BancoDeTiempo)

introducir la descripción de la imagen aquí

pero cuando voy a "Mis Servicios" "Ver Servicios" el logo

"desparece"

introducir la descripción de la imagen aquí

tampoco sé como hacer que el div container se adapte al tamaño de BancoDeTiempo ( que me deja la "o" huérfana)

Muchas gracias

este es mi Layout completo:

 <!DOCTYPE html>
    <html lang="es">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>@ViewData["Title"] - AppBancoDeTiempo</title>
        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
        <link rel="stylesheet" href="~/css/site.css" />
    
    </head>
    <body>
        <header>
            
            <nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-lg-3">
                <img src="Img/LogoBankOfTime.png" alt="Logo" width="100" class="d-inline-block"/>
                <div class="container">
                <a class="navbar-brand" asp-area="" asp-controller="Home" asp-action="Index"><b>BancoDeTiempo</b></a>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".navbar-collapse" aria-controls="navbarSupportedContent"
                        aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                
                 <div class="navbar-collapse collapse d-sm-inline-flex justify-content-between">
                    <partial name="_LoginPartial" />
                    <ul class="navbar-nav flex-grow-0">
    
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Privacy">Uso</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="Servicio" asp-action="MisServicios"> Mis Servicios</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="User" asp-action="CrearUsuario">Registrar Usuarios</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="User" asp-action="Index">Ver Usuarios</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="Opinion" asp-action="Index">Opiniones</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="Servicio" asp-action="CrearServicio"> Crear Servicio</a>
                        </li>
    
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                Ver Servicios
                            </a>
                            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                                <a asp-controller="Servicio" asp-action="Listar" asp-route-id="1">Ofertas</a>
                                <a asp-controller="Servicio" asp-action="Listar" asp-route-id="2">Demandas</a>
                            </div>
                        </li>
                    </ul>
                </div>
                </div>
            </nav>
        </header>
        <div class="container">
            <main role="main" class="pb-3">
                @RenderBody()
            </main>
        </div>
    
        <footer class="border-top footer text-muted">
            <div class="container">
                &copy; 2021 - AppBancoDeTiempo - <a asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
            </div>
        </footer>
        <script src="~/lib/jquery/dist/jquery.min.js"></script>
        <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
        <script src="~/js/site.js" asp-append-version="true"></script>
        @await RenderSectionAsync("Scripts", required: false)
    </body>
    </html>
    
    
2
  • Las imagenes no se subieron correctamente. Podrías editar tu pregunta y agregarlas por favor (si deseas)? El botón editar está abajo de la pregunta y las etiquetas.
    – Dante S.
    Commented el 29 may. 2021 a las 22:24
  • Gracias @DanteS.! ahí subí las imágenes bien
    – Alicia
    Commented el 29 may. 2021 a las 22:31

1 respuesta 1

0

Ya encontré el motivo.

Para el logo, añadí ../../ a la ruta de la carpeta Img, que es donde tengo el logo.

Para que se vean los nombres correctamente, he cambiado la clase container por la container-fluid, tal como se muestra continuación:

  <img src="../../Img/LogoBankOfTime.png" alt="Logo" width="100" height="100" class="d-inline-block"/>
   <div class="container-fluid">
1
  • ¡Hola! veo que encontraste solución al problema, pero si tuviste que cambiar la dirección del logo me da a entender que tienes tus views en distintas carpetas, si este es el caso te sugiero guardarlas todas en una misma carpeta donde no tendras "sorpresas" al tratar de llamar algun archivo estatico.
    – Anki Jedi
    Commented el 30 may. 2021 a las 8:20

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.