引导程序将图片嵌入网格元素

Question

I have discovered a discrepancy between bootstrap v3.0.0 and the latest version v3.3.0. I spend most of the day yesterday trying to figure it out and didn't have any luck. If i embed am image into a grid element with the following code: 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;
  }

in v3.3.0 ( v3.3.0 example ) it seems to work, but not in v3.0.0( v3.0.0 example ). In v3.0.0 the image does not stay within the row it is in when the window is made larger.

Is there a way to make it work in v3.0.0?

Answer 1

Adding .well{ overflow:auto; } .well{ overflow:auto; } to your CSS will allow the parent to encapsulate the descendant elements.