To arrange two columns beside each other without tables? 2

[hotfusion]

Please forgive my lack of knowledge about CSS, but I'm trying to position two separate columns of text of differing widths side by side on a page using CSS rather than tables, and can't find the information I need to do it. I've tried specifying margin-left and right for either <div>s or <p>s, along with a few other options I'm aware of but the results are the same: The first column always appears above the other rather than beside it.

Could anyone please give me a clue as to how it should be correctly done?
Many thanks in advance.

Regards, Andy.
**************************************
My pathetic attempts at learning HTML can be laughed at here:

http://myweb.tiscali.co.uk/andyspatch/index.htm

 

[chessbot]

#leftcol {
    [red]float: left;[/red]
    width: 100px;
    }

#rightcol {
    [red]float: right;[/red]
    width: 100px;
    }

#all {
    width: 200px;
    text-align: center;
    margin: 0 auto;
}

<div id="all">
 <div id="leftcol">
  This stuff should show up on the left
 </div>
 <div id="rightcol">
  this stuff should show up on the right
 </div>
</div>

Something like that?

--Chessbot

 

[philote]

This site shows several different layouts and their code, including a two-column one.

 

[hotfusion]

Thanks to both of you for your input. I'm used to using the float property for images in spans only, and had completely overlooked the fact that it can be used for other elements as well. Chessbot, you code was very helpful, as was the link supplied by Philote.

Looks like I might now have cracked the problem and am no longer at risk of pulling out any more of my hair!
Cheers guys.

Regards, Andy.
**************************************
My pathetic attempts at learning HTML can be laughed at here:

http://myweb.tiscali.co.uk/andyspatch/index.htm