自舉列側邊欄高度

我有一個與引導網格系統混淆我的問題，我有一個2列布局，成爲移動設備上的一列（col-xs-12）佈局。自舉列側邊欄高度

我遇到的問題是，在大屏幕上，如果我的側邊欄高於我的「標題股利」它佔用空白。

<div class="container"> 
    <div class="row"> 
     <div class="col-lg-8 col-md-8 col-sm-8 col-xs-12 header">header</div> 
     <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 sidebar">sidebar</div> 
     <div class="col-lg-8 col-sm-8 col-xs-12 main_content">main_content</div> 
    </div> 
</div>

繼承人jsbin： https://jsbin.com/helizemefa/edit?html,css,output

也許我只是站在上線現在..

感謝您的幫助！

來源

2017-06-08 Martin

.header{ 
 
    background-color:red; 
 
} 
 

 
.sidebar { 
 
    background-color:yellow; 
 
    
 
} 
 

 
.main_content { 
 
    background-color:green; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
<script src="https://code.jquery.com/jquery.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 

 
    
 
    
 
    <div class="container"> 
 
    <div class="row"> 
 
     <div class="col-lg-8 col-md-8 col-sm-8 col-xs-12 header">header</div> 
 
     <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 pull-right sidebar">sidebar</div> 
 
     <div class="col-lg-8 col-lg-8 col-sm-8 col-xs-12 main_content">main_content</div> 
 
    </div> 
 
    </div> 
 
</body> 
 
</html>

您可以在側邊欄添加pull-right，這個

 <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 sidebar pull-right">sidebar</div>

來源

2017-06-09 00:37:48

感謝的是解決它像！ – Martin

太好了，把問題標記爲正確。 –

自舉列側邊欄高度

回答

相關問題