Html CSS引导等高3行

我有一个垂直菜单，适合100%的高度。在这里面，我需要行是相等的高度拉伸，以适应这个容器。此外，使用该按钮似乎会使容器略微下降到页面下方。有没有办法在不将.button类定位为绝对类的情况下解决此问题

移动菜单
1.
2.
3.
4.
5.
6.

---

谢谢你的帮助！非常感谢

等高问题的一个解决方案是使用容器将单元格分成3行，并将每个单元格的高度设置为33%（如果愿意，可以设置为33.3%）。要使其工作，行的父容器需要100%的高度

关于正在放置的容器：当浏览器计算元素的高度时，会得到以下结果：

TotalHeight = (Height of the .button div) + (Height of the .mobileContainer div)
TotalHeight = (around 50px) + (100% of the parent container) = MORE than 100%

因此，基本上，您得到的高度比可用高度（100%）大，这就是浏览器显示滚动条的原因。有几种方法可以解决此问题，其中之一是为.button div设置固定高度，并定义.mobileContainer的高度，如下所示：

height: calc(100% - fixed height of the .button div)

根据该定义，您可以确保总高度始终为100%

我已经修改了你的提琴以显示两种解决方案

---

您可以使用jquery设置高度，并在每个

col-md-6

上放置一个父级

，以保留顺序

$(document).ready(function(){

    _height = $(window).height();    
    _innerheight = _height/3
    $(".respheight").height(_innerheight);
    $(".box").height(_innerheight);
    /*the border radius has 1px because is the difference between in the lines*/
});

检查

---

谢谢您的回复。这很有效。基本上，它将用于移动导航。所以它会在点击按钮时上下滑动。这应该可以工作并适应移动屏幕是吗？高度是动态的，所以移动屏幕应该不会有问题。

$(document).ready(function(){

    _height = $(window).height();    
    _innerheight = _height/3
    $(".respheight").height(_innerheight);
    $(".box").height(_innerheight);
    /*the border radius has 1px because is the difference between in the lines*/
});