<jsp:include> 不尊重 jsp 的位置样式

Question

我有一个 index.jsp，其中包括 <jsp:include> 的 header.jsp。文档 header.jsp 有 2 个元素，我已将其放置在 右下角 。如果我将 header 文件作为 .html 执行，两个元素的位置都正确，但是当我执行 index.jsp 时，两个项目都位于 右上角 忽略 just 位置样式，因为如您所见，loginButton 和 messageLabel div 仍然具有其余样式。

如果我像执行 html 一样执行 header，这就是我所看到的（我正确地看到了）：

这就是我在本地服务器上执行 index.jsp 时所看到的：

index.jsp:

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
    </head>
    <body>
        <jsp:include page="header.jsp" />
        <h1>Hello World!</h1>
    </body>
</html>

header.jsp:

<link rel="stylesheet" type="text/css" href="Resources/Styles/headerStyles.css" />
<header id="header">
    <label id="messageLabel">User not registered</label>
    <div id="loginButton">
        Login
    </div>
</header>

headerStyles.css:

#header {
    background-color: yellow;
    width: 100%;
    height: 92px;
}

#loginButton {
    position: absolute;
    right: 8;
    top: 60;
    background-color: darkorange;
    height: 40px;
    width: 80px;
    text-align: center;
    line-height: 40px;
    font-weight: bolder;
    font-size: 15pt;
}

#messageLabel {
    position: absolute;
    right: 100;
    top: 70;
}

Answer 1

好的，我知道了。您只需在属性 right 和 top 中指定度量单位，如下所示：

#header {
    background-color: yellow;
    width: 100%;
    height: 92px;
}

#loginButton {
    position: absolute;
    right: 8px;
    top: 60px;
    background-color: darkorange;
    height: 40px;
    width: 80px;
    text-align: center;
    line-height: 40px;
    font-weight: bolder;
    font-size: 15pt;
}

#messageLabel {
    position: absolute;
    right: 100px;
    top: 70px;
}

看来措施必须遵循正确指定其适当的计量单位。挺严格的。

<jsp:include> 不尊重 jsp 的位置样式

<jsp:include> not respecting position styles of the jsp included

css

java

jsp

css-position

jspinclude