How to make DIV appear inline?

[anif]

Hi, this is mind boggling. I have 3 DIV's inside a wrapper DIV. I want those 3 DIV's to appear horizontally next to eachother inside the wrapper DIV and NOT one under the other. I have the following CSS:

#wrapperA{
position: relative;
display: inline;
left: 0;
width: 100%;
height: 150px;

}

#cal{
position: relative;
display: block;
width: 30%;
height: auto;
}

#ad{
position: relative;
display: block;
width: 30%;
height: auto;
}

#news{
position: relative;
display: block;
width: 30%;
height: auto;
}

this does not seem to be working though, anyone know how to go about this? I also tried a "float: left" in the wrapper DIV instead of "display: inline"...that doesn't work either.

[simplistik]

float: left;

[anif]

I tried this:

#wrapperA{
position: relative;
float: left;
width: 100%;
height: 150px;

}

It is still not displaying inline....not sure why this is, any clues?

[ramie]

loose the position from wrapperA

[anif]

thanks...it is working now!