Sætte flere div's på samme linie med css

Hej, jeg har denne kode:

<div id="artist_container">

    <div id="artist_list_left">
    </div>

    <div id="artist_list_center">
    </div>

    <div id="artist_list_center">
    </div>

    <div id="artist_list_center">
    </div>

    <div id="artist_list_center">
    </div>

    <div id="artist_list_center">
    </div>

    <div id="artist_list_center">
    </div>

    <div id="artist_list_center">
    </div>
   
    <div id="artist_list_right">
    </div>


</div>

Med denne css tilknyttet:


#artist_container {width: 880px; height: 147px; background-color: #3c3c53;}


#artist_list_left {width: 98px; height: 147px; background-image: url(./img/artist_list_left.png); }
#artist_list_center {width: 98px; height: 147px; background-image: url(./img/artist_list_center.png); }
#artist_list_right {width: 96px; height: 147px; background-image: url(./img/artist_list_right.png); }


Når jeg åbner siden, kommer alle div på hver sin linie, men jeg vil gerne have dem side om side. Er der en nem løsning på det?

PS Det skal helst løses uden tables. Jeg er ved at bygge 2 versioner af samme side (med og uden tables), for at se hvad der fungerer bedst.