我想弄清楚爲什麼我在引導程序中的scrollspy無法正常工作。我發現部分標籤堆疊在一起,無法正確使用子元素。bootstrap.css不會正確渲染節標籤
鉻合金風格的計算(與其他的browers一起)如下:
background-color: transparent;
color: #333;
display: block;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 13px;
height: 0px;
line-height: 18px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
width: 940px;
但<section>
內的數據計算:
background-color: transparent;
color: #333;
display: block;
float: left;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 13px;
height: 317px;
line-height: 18px;
margin-bottom: 0px;
margin-left: 20px;
margin-right: 0px;
margin-top: 0px;
width: 780px;
如果我註釋掉bootstrap.css(其我沒有編輯)這些部分是他們應該如何。引導程序唯一的作用是將section
設置爲block
。
我不知道我的HTML是否會導致問題。我的頁面佈局是:
<body>
<div class="container">
<header>
<h1>HEADER</h1>
<nav>
<div class="subnav">
<ul class="nav nav-pills">
<li><a href="#overview">Introduction</a></li>
<li><a href="#begin">The Beginning</a></li>
...
</ul>
</div>
</nav>
</header>
<section id="overview">
<div class="span10">
<h2>Introduction</h2>
<hr class="full">
<p> text text text text </p>
</div>
</section>
<section id="begin">
<div class="span10">
<h2>The Beginning</h2>
<hr class="full">
<p> text text text text </p>
</div>
</section>
...
</div>
<script>..</script>
</body>
所有部分只是相互堆疊1px。什麼是bootstrap.css導致這個問題。這或我的佈局?我用JavaScript樣式編輯了每個變量,並直接引導到bootstrap.css。請幫幫我。
更新
我寫了一個簡單的頁面,它仍然不計算<section>
標籤權利。