Bootstrap:好的图像

时间:2014-11-13 21:40:32

标签: html css twitter-bootstrap

enter image description here

正如您在此屏幕截图中看到的,图像不在.well元素中。 在这里你可以看到我的源代码:

<article class="well">
    <header>
        <h3>News mit Bild</h3>
        <p>
            <span class="glyphicon glyphicon-user"></span> Geschrieben von: <a href="#">TupidaMC</a><br/>
            <span class="glyphicon glyphicon-time"></span> Veröffentlicht am 13.11.2014 um 21:23
        </p>
    </header>
        <p class="news-content">... text ...</p>
        <img class="img-thumbnail news-pic" src="http://placekitten.com/g/350/251" />
        <p class="news-content">... text ...</p>
</article>

CSS:

.news-pic{
     float: right;
}

我想得到一些反响。

2 个答案:

答案 0 :(得分:7)

在文章标记中添加.clearfix类。

<article class="well clearfix">

jsFiddle

答案 1 :(得分:4)

这是一个小提琴:http://jsfiddle.net/7681Lstq/

我相信您只是想将overflow: hidden添加到CSS中的.well元素。