[Help] Hoe komt dit goed?

#box1 {background: url(images/box1.png); width: 210px; height: 200px; margin:0px 0px 0 0px;}
#box2 {background: url(images/box2.png); width: 210px; height: 200px; margin:0px 0px 0 225px;}
#box3 {background: url(images/box3.png); width: 210px; height: 200px; margin:0px 0px 0 226px;}
#box4 {background: url(images/box4.png); width: 210px; height: 200px; margin:0px 0px 0 227x;;}

<div id="box1"><div>
    <div id="box2"><div>
    <div id="box3"><div>
    <div id="box4"><div>

</div>

Ik krijg niet 4 van die blokjes naast elkaar : zie http://bit.ly/vdv4xY

Heeft iemand goede code, of oplossing?

Wat moet er anders dan?

#box1 {background: url(images/box1.png); width: 210px; height: 200px; margin:0px 0px 0 0px;}
#box2 {background: url(images/box2.png); width: 210px; height: 200px; margin:0px 0px 0 225px;}
#box3 {background: url(images/box3.png); width: 210px; height: 200px; margin:0px 0px 0 226px;}
#box4 {background: url(images/box4.png); width: 210px; height: 200px; margin:0px 0px 0 227px;}

En waarom heb je

<div id="box1"><div>
    <div id="box2"><div>
    <div id="box3"><div>
    <div id="box4"><div>

In plaats van

<div id="box1"></div>
    <div id="box2"></div>
    <div id="box3"></div>
    <div id="box4"></div>

ja maar nu staan ze onder elkaar?
Weetje toevallig wat ik moet instellen bij ditbij ze alle 4?: margin:0px 0px 0 0px;}

Dan moet je je margin gewoon wat veranderen, het punt is dat je bij div4 margin:0px 0px 0 227x;;} had staan, dit klopt niet. ;]

float: left; toevoegen.

Je wilt ze naast elkaar?
float: left;

Dankje, is gelukt.
Slotje mag erop