为什么Bootstrap列不能在这个小的HTML / CSS片段中工作？

I expect to have a left column 2 units wide and a right area 10 units long. However, for some strange reason it is not coming out that way.

我希望左栏2个单位宽,右栏10个单位长。然而,由于一些奇怪的原因,它不是那样出来的。

Anyone know why not?

谁知道为什么不呢?

#left {
  background-color: green;
}
#right {
  background-color: yellow;
}

<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet"/>

<div id="main-row" class="row">
  <div id="left" class="col-xs-2">
    <p>Yo</p>
    <button class="btn btn-primary">A Button</button>
  </div>
  <div id="right" class="col-xs-10">
    Ho
  </div>
</div>

1 个解决方案

#1

You're using Bootstrap 3 HTML with Bootstrap 2 CSS.

您正在使用Bootstrap 3 HTML和Bootstrap 2 CSS。

Change your link to:

将您的链接更改为:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">

#1