Question

以下是代码：

<html>
  <head>
    <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap-1.1.1.css" rel="stylesheet" />
  </head>
  <body>
    <div class="container-fluid">
      <div class="sidebar">
        <div style="height: 500px; background: red;"></div>
      </div>
      <div class="content">
        <div style="height: 500px; background: #eee;">
          <ul class="tabs">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#">Profile</a></li>
            <li><a href="#">Messages</a></li>
            <li><a href="#">Settings</a></li>
            <li><a href="#">Contact</a></li>
          </ul>
        </div>
      </div>
    </div>
  </body>
</html>

以及指向实时预览的链接：http://jsfiddle.net/7W32Z/。

为什么边框最终会低于侧边栏？它与应用于<ul class="tabs" />元素的clearfix有关，因为如果仅我clear: right，边框会跳起来。

Answer 1

浮动ul.tabs，边框应该固定。

http://jsfiddle.net/laheab/7W32Z/3/

为什么<ul>清除左侧边栏？</ul>

1 个答案: