使用bootstrap 3证明图像周围的文本

use*_*133 0 html css twitter-bootstrap

我有使用bootstrap 3的内容框.

CSS:

.news-thumbs{
   margin:10px;
}
Run Code Online (Sandbox Code Playgroud)

HTML:

   <div class="row">
        <div class="col-md-6">
            <article class="feature">
                <figure class="pull-left news-thumbs thumbnail">
                    <img alt="" src="img/noor.png"><img alt="" src="http://1.gravatar.com/avatar/3a4fe156e7e23a3f6c023ab0abb305e2?s=160&amp;d=http%3A%2F%2Fcss-tricks.com%2Fimages%2Fget-gravatar.png%3Fs%3D160&amp;r=PG" class="avatar avatar-160 photo" height="160" width="160">
                </figure>
                <h1>

                    H1 Title

                </h1>
                <p class="justify">

                   Description …Description …Description …Description …Description …Description …Description …Description …Description
                  …Description …Description …Description …Description …Description …Description …Description …Description …
                   …Description …Description …Description …Description …Description …Description …Description …Description …
                   …Description …Description …Description …Description …Description …Description …Description …Description …
                   …Description …Description …Description …Description …Description …Description …Description …Description …
                   …Description …Description …Description …Description …Description …Description …Description …Description …
                   …Description …Description …Description …Description …Description …Description …Description …Description …
                   …Description …Description …Description …Description …Description …Description …Description …Description …
                   …Description …Description …Description …Description …Description …Description …Description …Description …
                   …Description …Description …Description …Description …Description …Description …Description …Description …

                </p>
            </article>
        </div>
    </div>
Run Code Online (Sandbox Code Playgroud)

现在我输出结果我看到图像下面的空白/空白:

在此输入图像描述

我该如何解决这个问题?

演示:http://jsfiddle.net/mth4aLx3/

rye*_*lar 5

在你的css:FORKED JSFIDDLE

更改

.news-thumbs{
  margin: 10px;
}
Run Code Online (Sandbox Code Playgroud)

.news-thumbs{
  margin: 0 10px 0 10px;
  padding-bottom: 0;
}
Run Code Online (Sandbox Code Playgroud)

  • 如果改变`margin:0 10px 0 10px;`(margin-top:0)你的代码不起作用.演示:http://jsfiddle.net/mth4aLx3/2/ (2认同)