2

Resulta que estoy realizando una aplicación con Spring Boot en la cual tengo tres archivos HTML en los cuales estoy metiendo CSS de bootstrap. En los dos primeros HTML no he tenido ningún problema para que me reconociera el CSS pero cuando he llegado al último no se aplican los estilos. He copiado y pegado uno de los otros HTML para comprobar que no se me haya olvidado nada, pero mientras los dos primeros funcionan el tercero sigue mostrando HTML plano. Os muestro lo que tengo.

HTML que falla:

<!DOCTYPE html>
<html lang="en">
<head>  

    <title>Incidence Manager</title>

    <!-- Bootstrap Core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
</head>


<body>
<!-- Navigation Bar -->
<nav class="navbar navbar-default">
  <div class="container-fluid">

    <div class="navbar-header">
      <a class="navbar-brand">Dashboard</a>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <div class="navbar-form navbar-right">
            <a href="/index" class="btn btn-primary"> <span class="glyphicon glyphicon-log-out"></span> Log out</a>
        </div>
    </div>
  </div>
</nav>


<!-- Page content -->
<div class="container-fluid">
    <div class="row">
        <div class="col-md-12" >
            <h1 class="page-header">Incidence Manager</h1>
        </div>
    </div>
</div>

<!-- jQuery -->
<script src="js/jquery.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<!-- Metis Menu Plugin JavaScript -->
<script src="js/metisMenu.min.js"></script>

</body>
</html>
2
  • Una duda que puede ayudar: ¿Cuáles son las URL para pedir cada una de las páginas, tanto las que funcionan como las que no? Commented el 26 mar. 2018 a las 11:21
  • @PabloLozano Las URL que funcionan son "/index" y "/operatorpanel". Donde me da el fallo, que es la url que llama a ese html es en "manage/id" donde id es un id de una incidencia. Commented el 26 mar. 2018 a las 11:28

1 respuesta 1

2

El problema es el siguiente:

Cuando cargas las páginas con URL loquesea.com/index, o loquesea.com/operatorpanel, la etiqueta

<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css"/>

tiene una URL relativa, con lo que asusme que tiene que buscar en loquesea.com/css/bootstrap.min.css

pero si el HTML tiene una URL como loquesea.com/manage/id, la dirección relativa hace que el navegador busque en loquesea.com/manage/css/bootstrap.min.css

La solución es añadir un / delante de la ruta para que no sea relativa, sino absoluta:

<link href="/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>

Esa primera barra hace que la ruta tome como base el dominio actual, ignorando posibles carpetas.

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.