Creating 2 columns inside a column

How would I go about doing this?

I have a news section on my site which I want to seperate into two columns, so I can put some new on the left hand side of the page and some on the right.

Any help would be greatly appreciated.

Here is my site: www.fiorenzato.co.uk

You could have something like,

.newsleft {
float: left;
width: 400px;
}
.newsright {
padding-left: 410px;
}

And place them between your Centrecolumn div, like so:

<div class="Centrecolumn"><p><img src="assets/images/news.jpg" alt="Who Are We?" width="250" height="50" /></p>
<div class="newsleft"><p>TEST</p></div>
<div class="newsright"><p>TESTING</p></div>

</div>

By the way, your alt for your news image still reads "Who Are We?", I guess that is meant for another page? :)

P.S - I am still new to this, so forgive me if my solution isn't the most efficient.

EDIT: You might also want to fix these errors: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.fiorenzato.co.uk%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

Regards,
Nick

Thanks for that mate. I'll fix the errors and try out your advice.

If anyone else has anymore input then i'd appreciate it also.

I still haven't fixed this issue.

Do I have to create a CSS rule and apply it to the text I want on the right hand side of the page?

If so...I don't know what properties I must include to create the second column of text.

I want it to look something like the following:

http://www.cooperscoffee.com/news.html

try something like this...

css:

<style type="text/css">
div#container {width:830px; margin:auto; overflow:hidden; background-color:#99CCCC;}
div#colL {width:400px; float:left;}
div#colR {width:400px; float:right;}
</style>


body:
<div id="container">

<div id="colL">left column content here</div>

<div id="colR">right column<br /> content here</div>

</div>

Thanks for that mate. I've just tried it and so far it's looking good! I appreciate it mate.

Much love.