Twitter-Bootstrap中的响应井?

时间:2013-03-19 18:46:22

标签: html css html5 twitter-bootstrap responsive-design

考虑到这种包装:

<div class="container">
    <div class="row-fluid swell">
    <div class="span9">
        hello world
    </div>
</div>
</div>

使用这种样式(在twitter-bootstrap上面):

.swell {
    background-color: #F5F5F5;
    border: 1px solid #E3E3E3;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset;
    margin-bottom: 20px;
    min-height: 20px;
    padding: 19px;
}

如何获得优雅的响应能力?

Plnkr您可以在其中看到网站正在运行;拖动浏览器窗口的一侧以查看问题)

2 个答案:

答案 0 :(得分:0)

不要在行和井中创建div:

<div class="row-fluid">
  <div class="swell">
    <div class="span9">
     hello world
    </div>
  </div>
</div>

答案 1 :(得分:0)

找出解决方案:

<div class="swell">
    <div class="row-fluid">
        <div class="span9">
            Hello world!
        </div>
    </div>
</div>