2013-01-03 52 views
1

Twitter Bootstrap API告訴我添加我的css來添加填充到bootstrap css和bootstrap-responsive css之間的正文元素。我在_master文件中這樣做了,但它似乎沒有添加填充靜止。Bootstrap樣式表的正確順序

我是不是正確地閱讀了這些內容,或者可能是其他問題?

_master頭部分

<head> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<title>Get Bootstrapped</title> 
<link href="@Url.Content("~/css/bootstrap.css")" rel="stylesheet" /> 
<link href="@Url.Content("~/css/skin.css")" rel="stylesheet" /> 
<link href="@Url.Content("~/css/bootstrap-responsive.css")" rel="stylesheet" /> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
</head> 
<body> 
    <div class="container"> 
     <div class="navbar navbar-fixed-top"> 
      <div class="navbar-inner"> 
       <a class="brand" href="#">Title</a> 
       <ul class="nav"> 
        <li class="active"><a href="#">Home</a></li> 
        <li><a href="#">Link</a></li> 
        <li><a href="#">Link</a></li> 
       </ul> 
      </div> 
     </div> 
     <div> 
      @RenderBody() 
     </div> 
    </div> 
    <script src="~/js/bootstrap.js"></script> 
</body> 

CSS

body { 
    padding-bottom: 40px; 
} 

體填充的可視化不工作(滾動一路到頂部) enter image description here

回答

2

你需要做的是給padding-top: 40px包含正文的div。

例:Fiddle

<div class="container"> 
    <div class="navbar navbar-inverse navbar-fixed-top"> 
     <div class="navbar-inner"> 
      <a class="brand" href="#">Title</a> 
      <ul class="nav"> 
       <li class="active"><a href="#">Home</a></li> 
       <li><a href="#">Link</a></li> 
       <li><a href="#">Link</a></li> 
      </ul> 
     </div> 
    </div> 

    <div style="padding-top: 40px"> 
     some content 1<br /> 
     some content 2<br /> 
     some content 3<br /> 
     some content 4<br /> 
    </div> 
</div> 
+0

這就是我得到在凌晨4點這個東西的工作...這是確切的問題。 – Cody

0

我想你可能想用padding-top: 40px代替?