1
부트 스트랩의 내 scrollspy가 작동하지 않는 이유를 알아 내려고하고 있습니다. 섹션 태그가 겹쳐져 있고 하위 요소와 올바르게 작동하지 않는다는 것을 알았습니다.bootstrap.css가 섹션 태그를 올바르게 렌더링하지 않습니다.
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> 내의 데이터는 다음과 같이 계산된다 : 다음과 같이
의 Chromes (다른 브로우저와 함께) 계산 된 스타일입니다 (
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가이 문제의 원인입니다. 이 또는 내 레이아웃? 나는 모든 변수를 자바 스크립트 스타일로 편집했고 바로 bootstrap.css로 연결됩니다. 도와주세요.
업데이트는
나는 간단한 페이지를 작성하고 여전히 <section> 태그 권리를 계산하지 않습니다.