如何让 twitter bootstrap 在 plunker 中工作？

Question

这应该很容易，但我总是无法获得一个简单的 bootstrap 在 plunker 中工作的示例。

我在 my plunker project 中有这个简单的 bootstrap 示例：

<!DOCTYPE html>
<html>

  <head>
    <link data-require="bootstrap-css@3.3.6" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" />
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
    <div class="container">
      <div class="row">
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
      </div>
      <div class="row">
        <div class="col-md-8">.col-md-8</div>
        <div class="col-md-4">.col-md-4</div>
      </div>
      <div class="row">
        <div class="col-md-4">.col-md-4</div>
        <div class="col-md-4">.col-md-4</div>
        <div class="col-md-4">.col-md-4</div>
      </div>
      <div class="row">
        <div class="col-md-6">.col-md-6</div>
        <div class="col-md-6">.col-md-6</div>
      </div>
    </div>
  </body>

</html>

如果我点击运行按钮，似乎 bootstrap 不可用。用 Chrom 检查 div 清楚地表明 bootstrap 在那里。但是根本没有格式化。

如果我点击预览按钮，一切都会按预期进行格式化。

有什么解决办法吗？

Answer 1

预览 window 不够宽。

尝试使用 col-xs-1 或 col-sm-8 而不是 col-md-1..!:-)

如何让 twitter bootstrap 在 plunker 中工作？

How to get twitter bootstrap working in plunker?

css

twitter-bootstrap

plunker