Bootstrap: Image out of well

Question

As you can see in this screenshot, the image is out of the .well element. Here you can see my source code:

<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;
}

I would like to get some respone.

Answer 1

Here's a fiddle: http://jsfiddle.net/7681Lstq/

I believe that you are just looking to add overflow: hidden to the .well element in your CSS.

Answer 2

Add a .clearfix class to the article tag.

<article class="well clearfix">

jsFiddle