CSS - variable width divs for image with caption

by andfinally

HTML

<div class="blurb">Titania ( /tɨˈtɑːnjə/ or /taɪˈteɪniə/) is the largest of the moons of Uranus and the eighth largest moon in the Solar System at a diameter of 1,578 kilometres (981 mi). Discovered by William Herschel in 1787, Titania is named after the queen of the fairies in Shakespeare's A Midsummer Night's Dream. Its orbit lies inside Uranus' magnetosphere.
        <p>Titania consists of approximately equal amounts of ice and rock, and is probably differentiated into a rocky core and an icy mantle. A layer of liquid water may be present at the core–mantle boundary. The surface of Titania, which is relatively dark and slightly red in color, appears to have been shaped by both impacts and endogenic processes. It is covered with numerous impact craters reaching up to 326 kilometres (203 mi) in diameter, but is less heavily cratered than the surface of Uranus' outermost moon, Oberon. Titania probably

        <div class="image fl-l">
            <img src="http://news.bbcimg.co.uk/media/images/58306000/jpg/_58306890_snowtreesafp.jpg" alt="_58306890_snowtreesafp.jpg" class="fluid"><span>A wintry scene, with many trees bowed under the weight of snow. And a long line which may or may not be broken.</span>
        </div>
        underwent an early endogenic resurfacing event which obliterated its older, heavily cratered surface. Titania's surface is cut by a system of enormous canyons and scarps, the result of the expansion of its interior during the later stages of its evolution.</p>
        <p>Like all major moons of Uranus, Titania probably formed from an accretion disk which surrounded the planet just after its formation. Infrared spectroscopy conducted from 2001 to 2005 revealed the presence of water ice as well as frozen carbon dioxide on the surface of Titania, which in turn suggested that the moon may possess a tenuous carbon dioxide atmosphere
            <i>with a surface pressure</i> of about one
            <b>10 trillionth</b> of a bar. Measurements...

CSS

.blurb {
    width: 90%;
    margin: 20px auto;
    padding: 15px;
    background: #F7F6F6;
    border: 1px solid #DDD;
}

.image {
    display: inline-block;
    font-size: 0.9em;
    line-height: 1.3em;
    font-style: italic;
}

.image.fl-l {
    margin: 10px 10px 10px 0;
}

.image span {
    display: inline-block;
    padding-top: 5px;
}

img {
    display: block;
}

.fl-l {
     float: left;   
}

.fluid {
    max-width: 100%;
}