引導導航帶100％的高度

Question

所以，這是我的主頁：

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html lang="en">
<head>
    <title>TITLE</title>

    <link href="/resources/css/bootstrap.css" rel="stylesheet" type="text/css"/>
    <link href="/resources/css/myStyle.css" rel="stylesheet" type="text/css"/>
</head>

<body>

<jsp:include page="parts/header.jsp"/>
<jsp:include page="parts/leftMenu.jsp"/>

<h2>WELCOME IN MY STORE!!!</h2>
<h2>WELCOME IN MY STORE!!!</h2>
...
<h2>WELCOME IN MY STORE!!!</h2>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="/resources/js/bootstrap.min.js"></script>

</body>
</html>

如您所見，我在此處包括文件“ leftMenu.jsp”，在其中動態添加了一些我想顯示在左側欄中的類別。 這是文件：

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<div class="nav nav-pills nav-stacked col-lg-1">

    <c:forEach items="${categoryNames}" var="category">
        <c:choose>
            <c:when test="${category.getSubCategories().size()>'0'}">
                <li><a data-toggle="collapse" href="#${category.getName().toLowerCase()}">${category.getName()}<span
                        class="caret"/></a></li>
                <ul id="${category.getName().toLowerCase()}" class="collapse">
                    <c:forEach items="${category.getSubCategories()}" var="subCategory">
                        <li><a href="category/${category.getId()}/${subCategory.getId()}">${subCategory.getName()}</a>
                        </li>
                    </c:forEach>
                </ul>
            </c:when>
            <c:otherwise>
                <li><a href="category/${category.getId()}/0">${category.getName()}</a></li>
            </c:otherwise>
        </c:choose>
    </c:forEach>

</div>

我希望此側邊欄占據整個可用高度，所以我嘗試添加此myStyle.css：

.nav {
    height: 100%;
    min-height: 100%;
}

但這不符合我的要求。

我該如何解決？

Answer 1

嘗試設置position: absolute;
這是有效的解決方案https://jsfiddle.net/L24x1o20/2/

引導導航帶100％的高度

問題描述

1 個解決方案

解決方案1
1 已采納 2016-05-07 17:29:17

引導導航帶100％的高度

問題描述

1 個解決方案

解決方案1 1 已采納 2016-05-07 17:29:17

解決方案1
1 已采納 2016-05-07 17:29:17