Min paragraphp width

by infous

HTML

<div>
<img src="https://encrypted-tbn3.google.com/images?q=tbn:ANd9GcT8yv4Qjw7wRZDOXU50eBWbUooauqYthOfLsf-ZSh2gYdsE8fDF1A" />
<p>This is a small paragraph.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fringilla mollis eros, in molestie quam pellentesque eu. Donec fermentum urna in dolor fermentum vehicula. </p>
</div>
<a href="http://css-tricks.com/minimum-paragraph-widths/">http://css-tricks.com/minimum-paragraph-widths/</a>

CSS

div {
    width: 300px;
    outline: 1px solid red;
    padding: 10px;
    margin: 10px;
}
img {
    float: left;
}
p:before {
    content: "";
    display: block;
    width: 10em;
    overflow: hidden;
    border: 1px solid green; /* for demonstration */
}
/*p {
    min-width: 10em;
    outline: 1px solid green; 
}
@media screen and (max-width: 400px) {
    img {
        float: none;
    }
}*/