Question

我发现bootstrap v3.0.0和最新版本v3.3.0之间存在差异。我昨天大部分时间都在试图解决这个问题并且没有任何运气。如果我使用以下代码将am image嵌入到grid元素中： HTML：

<div class="container-fluid">
    <div id="page-content" class="application-body-home">
        <h1>Heading</h1>
        <div id="intro" class="row-fluid">
            <div class="well">
                <div id="introPic" class="media-left">
                <p>
                  <img style="float: left; margin:0px 15px 15px 0px; height: 200px;" src="http://tmacfitness.com/wp-content/uploads/2013/04/Beauty-of-nature-random-4884759-1280-800.jpg" class="img-responsive">

              In ancient manuscripts, another means to divide sentences in into paragraphs was a line break (newline) followed by an initial at the beginning of the next paragraph. An initial is an oversize capital letter, sometimes outdented beyond the margin of text. This style can be seen, for example, in the original Old English manuscript of Beowulf. Outdenting is still used in English typography, though not commonly.[4] Modern English typography usually indicates a new paragraph by indenting the first line. This style can be seen in the (handwritten) United States Constitution from 1787. For additional ornamentation, a hedera leaf or other symbol can be added to the inter-paragraph whitespace, or put in the indentation space.
              </p>
            </div>
          </div>
        </div>
    </div>

</div>

CSS：

/* CSS used here will be applied after bootstrap.css */

#col1 {
  background-color: #f1f2f6;

}
#col1:first-child {
  padding: 0 4px 0 0;
}
#col1:nth-child(2) {
  padding: 0 4px;
}
#col1:last-child {
  padding: 0 0 0 4px;
}
.col-inside{
border: solid 1px #000000;
}

#intro{
    border: solid 2px #000000;
  }

在v3.3.0（v3.3.0 example）中似乎有效，但在v3.0.0（v3.0.0 example）中却没有。在v3.0.0中，当窗口变大时，图像不会保持在row范围内。

有没有办法让它在v3.0.0中运行？

Answer 1

将.well{ overflow:auto; }添加到CSS将允许父级封装后代元素。

Bootstrap在网格元素中嵌入图片

1 个答案: