Placing 2 DIVs side by side..

Hi!
Something like this should solve your problem.


Code:

div { width: 300px; border: 1px solid red; float: left}

and, in the html:

Code:

<div>Woho, first div!</div>
<div>And a second one!</div>

////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////


Hi,
To get one column to go to the left and one to the right you could do this:

CSS Code:

#leftcolumn { width: 300px; border: 1px solid red; float: left}
#rightcolumn { width: 300px; border: 1px solid red; float: right}

 and the html will be:
Code:

<div id="leftcolumn"><p>text goes here</p></div>
<div id="rightcolumn"><p>text goes here</p></div>

Also if you use float it affectivly removes that element from any surrounding div. To get around this problem try and add a div class which has 'clear' set to 'both' to your html. This make all the divs sit nicely in there container Like this:

CSS Code:

.clear { clear: both;}

html Code:

<div id"container">
<div id="leftcolumn"><p>text goes here</p></div>
<div id="rightcolumn"><p>text goes here</p></div>
<div class"clear"></div>
</div>