2013-07-29 11 views
8

Jestem nowicjuszem w BootStrap, aby poznać arkany i zrozumieć je. Próbuję osiągnąć 100% wysokość w siatce słupów, tak aby pokrywała 100% wysokość strony. W tej chwili nie ustawiono żadnej wysokości. Kiedy próbuję określić wysokość obu kolumn col-lg-9 i col-lg-3 w pikselach lub% nie nastąpi żadna zmiana. Nie wiem, jaki może być problem. Oto podstawowa struktura UżywamUstawienie 100% wysokości do kolumn w serwisie Twitter 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> 

I tu jest css dla każdej pozycji

@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%; 
} 
+1

spróbuj ustawić wysokość na elementach nadrzędnych oraz HTML i ciało na początek – Danield

Odpowiedz

18

spróbuj tego:

html,body 
{ 
    height: 100%; 
} 

Jeśli to nie zadziała, a następnie użyć sprawdź element i sprawdź, czy elementy rodzica mają 100% wysokości. (Bo jeśli nie - to elementy potomne nie dostaniesz 100% wysokości, chyba że są position:absolute lub position:fixed

+0

głosuje się wysokość Prop w procentach trafia! z elementu nadrzędnego – RDK

+1

który nie działa Mam ustawioną wysokość dla wszystkich elementów html, body, kontener, wiersz, a następnie kolumny ale nie działa –

+0

@AhmarAli Właśnie użyłem elementu inspekcji i dodałem 100% na html, kontenerze ciała i wierszu - i działa, ale jeśli zastosujesz 100% wysokość w rzędzie - nie dodawaj go do klasy wiersza, lecz do elementu.style lub KAŻDY rząd będzie miał 100% wzrost! – Danield

Powiązane problemy