[HTML/CSS]images met daaronder tekst naast elkaar

[TheDane]

*le kick*

Ik heb eigenlijk precies 't zelfde probleem.

HTML:

<div id="theImages">        
    <div class='bb'>
        <div style='height: 100px;'><a href="#" onclick="showDetails('plaatje);return false"><img class='thumb' src="images/thumbnails/plaatje1.jpg"></a></div>
        <div class='thumbTitle'>title plaatje 1</div>
    </div>
    <div class='bb'>
        <div style='height: 100px;'><a href="#" onclick="showDetails('plaatje);return false"><img class='thumb' src="images/thumbnails/plaatje2.jpg"></a></div>
        <div class='thumbTitle'>title plaatje 2</div>
    </div>
    <div class='bb'>
        <div style='height: 100px;'><a href="#" onclick="showDetails('plaatje);return false"><img class='thumb' src="images/thumbnails/plaatje3.jpg"></a></div>
        <div class='thumbTitle'>title plaatje 3</div>
    </div>
</div>

en

Cascading Stylesheet:

    #theImages{
        position:absolute;
        height:140px;
        left:20px;
        float: left; 
        width: 240px;
        overflow: auto;
        clear: none;
    }
    .bb {
        float: left;
        display: inline;
        width: 100px;
        padding-left: 2px;
    }
    .thumb {
        border: 1px solid black;
        margin-left: 5px;
        margin-right: 5px;
    }

Wat dus de bedoeling is, is dat alle plaatjes naast elkaar staan, met de titels er netjes onder.
Maar ik krijg geen horizontale scrollbar, de plaatjes die niet meer naast elkaar passen willen persé naar een nieuwe regel. En da's dus niet de bedoeling.

Ik heb voor m'n gevoel al alle varianten met float en display gehad, maar 't lukt me maar niet.

Iemand een idee?