0

Bootstrap でフッターを組み立てようとしています。何らかの理由で、フッター リンクtext-align: center;が適用されていることを確認しているにもかかわらず、中心からわずかにずれて表示されます。すべてのテキスト要素が実際に正しく配置されていることを確認する方法はありますか?

HTML

<!DOCTYPE html>
<html>
  <body>
    <div class="container-fluid">
      <section class="row-fluid">
        <div class="span12">
          <h1 class="landing">
            Lorem Ipsum
          </h1>
          <h4 class="landing">
            Lorem Ipsum Lorem Ipsum Lorem Ipsum
          </h4>
        </div>
      </section>
    </div>
    <footer class="footer">
      <section class="row-fluid">
        <ul class="footer-links">
          <li>
            <a href="#">Contact</a>
          </li>
          <li>
            <a href="#">About</a>
          </li>
        </ul>
      </section>
    </footer>
  </body>
</html>

CSS

h1.landing {
  text-align: center;
  font-size: 400%;
}

h4.landing {
  text-align: center;
}

.footer-links {
  list-style-type: none;
  text-align: center;
}

.footer-links li {
  display: inline;
  padding-right: 10px;
}
4

1 に答える 1

0

UL左パディングがあるようです。削除してみてください。

.footer-links {
  list-style-type: none;
  text-align: center;
  padding:0px;
}

http://jsfiddle.net/S8mGk/1/

于 2013-04-18T00:01:32.947 に答える