"Forçar" apenas scroll left

Eae galera o/

Estou com uma dúvida muito noob aqui.

Quero fazer isso:

/applications/core/interface/imageproxy/imageproxy.php?img=http://img208.imageshack.us/img208/8936/62025398.png&key=54c0673c9de807acdd2c637a786a5493a7a067f442cb7e52874ee2ab00aa0858" alt="Imagem Postada" />

Quando o conteudo chega no limite da div, ela quebra a linha, mas eu quero que continue, para usar o scroll.

HTML:

<div id="mygallery" class="stepcarousel">
<div class="belt" style="width:500px">

<div class="panel">
<a href="#">1</a>
</div>

<div class="panel">
<a href="#">3</a>
</div>

<div class="panel">
<a href="#">4</a>

</div>

<div class="panel">
<a href="#">5</a>
</div>

<div class="panel">
<a href="#">6</a>
</div>
</div>
</div>

CSS:

div#mygallery{

 float: left;
}

.stepcarousel{
border: 5px solid transparent;

overflow: scroll; /leave this value alone/
width: 205px;
height: 50px; /Height should enough to fit largest content's height/
}

.stepcarousel .panel{

float: left;
margin:0 5px;
min-width: 15px;
height: 16px;
background-color: #ffcc00;
text-align: center;
padding: 0 0px 1px 0px;
margin-top:1px;
vertical-align: middle;
}

Eu só consegiu colocando um width fixo para ".belt", mas eu quero que isso seja automatico... Alguém tem uma idéia?