在Twitter中将100％高度设置为列Bootstrap

我是BootStrap的新手，因此了解绳索并了解它。我试图在列网格中实现100％的高度，以便覆盖页面的100％高度。现在没有高度设置。当我尝试以像素或％为单位指定col-lg-9和col-lg-3的高度时，不会发生任何更改。不知道可能是什么问题。这里是我使用在Twitter中将100％高度设置为列Bootstrap

<body> 
<div class="row"> 
"Top bar" 
</div> 
<div class="container"> 
     <div class="row"> 
     <div class="col-lg-3"> 
side bar 
</div> 

<div class="col-lg-9"> 
side bar 
</div> 

</div>

的基本结构和这里是每个项目的CSS

@media (min-width: 1200px) 
.container { 
max-width: 1170px; 
} 
.row { 
margin-bottom: 20px; 
} 
.col-lg-9 { 
width: 75%; 
padding: 10px 20px; 
border-radius: 0 10px 10px 0; 
-moz-border-radius: 0 10px 10px 0; 
-webkit-border-radius: 0 10px 10px 0; 
-o-border-radius: 0 10px 10px 0; 
border: 0 none; 
padding-top: 3%; 
min-height: 90%; 
} 
.col-lg-3 { 
width: 25%; 
background-color: #192D38; 
color: #88A7A9; 
min-height: 90%; 
}

来源

2013-07-29 Ahmar Ali

尝试设置的父元素的高度以及HTML和身体对于初学者 – Danield

试试这个：

html,body 
{ 
    height: 100%; 
}

如果不工作，然后用检查元素，并验证父元素的高度为100％。（因为如果他们没有 - 那么子元素不会得到100％的高度，除非它们是position:absolute或position:fixed

来源

2013-07-29 10:00:06 Danield

投票了以百分比道具高度变！从父元素 – RDK

，不工作我已经设置高度的所有元素的HTML，身体，容器，行，然后列但无效 –

@AhmarAli我只是使用检查元素，并添加了100％的HTML，身体容器和行 - 并且它可以工作，但是当你在行上应用100％的高度时 - 不要将它添加到行类，而是添加到element.style，否则每行都会获得100％的高度！ – Danield

在Twitter中将100％高度设置为列Bootstrap

回答

相关问题