Ok, watch and learn. This might be the solution to your problem:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
body {
margin: 0;
padding: 0;
background-color: #000;
}
img {border: 1px solid #000;}
#main_border {
margin: 20px auto;
padding: 5px;
border: 1px solid #000;
width: 730px;
background-color: #006;
}
#header {
width: 730px;
height: 120px;
background: url(http://www.dracan.co.uk/images/header2.jpg) top left no-repeat;
border: 1px solid #000;
text-indent: -1000px;
margin: 0 0 5px 0;
padding: 0;
}
#header a {
display: block;
width: 730px;
height: 120px;
}
#content_border {
background-color: #99C;
border: 1px solid #000;
width: 100%;
}
#article_left {
float: left;
width: 50%;
padding: 5px;
text-align: justify;
}
#article_images {
float: right;
padding: 5px;
}
.clear {clear: both;}
</style>
</head>
<body>
<div id="main_border">
<h1 id="header"><a href="index.html">Dracan</a></h1>
<div id="content_border">
<div id="article_left">
<span class="article_header">
Silverstone National (Nov 2005)<br />
<br />
My first trackday<br />
</span>
<br />
Check in time for the trackday was 7.30 in the morning. So up at 6am, showered, packed my bag and off I went. About five minutes from my house a ZX-7R came past me. Now at 7am on a Sunday morning, I obviously wondered if he was also going to Silverstone. When he also gets off the M40, I'm then sure of it. Sure enough, as we get to the next roundabout, he stops and asks me if I'm going to Silverstone. Coincidently enough, he turns out to be White Noise (Mike) from the Bike Chat Forums - ie. one of the group that I was going to meet up with there. Once we continued our ride to Silverstone, I very nearly had my first bike accident! The roads were quite wet and slippery, and as I came off one of the roundabouts, my back wheel skidded out and I had my first tank-slapper. For those that don't know what a tank-slapper is, download this video <a href="http://www.dracan.co.uk/videos/tankslapper_320x240.mpeg">here</a>. Luckily, mine was nowhere near as bad as this, and I didn't come off either! I hadn't even got to the track yet, and I had nearly come off - didn't bode well really! Then a few minutes later, it starts to rain!<br />
<br />
When we got there, the others were already in our paddock. My nerves improved a bit when I find out that Yokogeri had only passed his test last week, and this was his first go on a big bike. So I wasn't the only newbie to biking! Top marks to him for having the balls to get out there! (or lack of brain cells! and looking at the bike he's on - I'm guessing it was a bit of both! ;)). Check out the picture <a target="new" href="http://www.dracan.co.uk/cpg134/albums/bikes/silverstone_131105/DSC01478.JPG">here</a> of the orange R6 that is very precariously placed on a very out of shape paddock stand! He was very kindly loaned this bike from G (another bike chat forum member).<br />
<br />
First job of the day was to sort out the bike before going on the track. This involved removing mirrors and licence plate. Although these were both optional, the mirror removal is highly recommended as you will get put off by what's happening behind you. It's very important to only concentrate on what's going on ahead. What goes on behind you isn't your responsibility. I also had to set up my camcorder/bullet cam. Once this was all sorted, we all went to register. Registration was just a case of filling in an indemnity form and showing our driver's licences. After that we went straight to the briefing. We were talked through the track, given safety advice, and had the rules of the track explained (i.e. what the different coloured flags mean, etc). We were then given a card that stated we had undertaken the briefing, which we had to hand in when first going on the track.<br />
<br />
There were three catagories - advanced, intermediate, and novice. There were six people in our group from the bike forum - myself, White Noise (Mike), Yokogeri (Scott), Silver (Damon), Davo (Dave) and wave2k (Dave). We all were in the novice group except Mike, who had his first attempt at the Intermediate catagory. The first out were the advanced group, followed by the intermediate group, then came my turn! The first three laps were sighting laps. This is where everyone follows the instructor around the track and no overtaking is allowed. It's a lot slower pace, and just gives everyone chance to get used to the track and warm their bikes up a bit. Surprisingly enough, there was an accident on one of the sighting laps in the novice group. I believe two bikes collided with each other. We all got waved off the track while they sorted it out, then back on we went. Due to the rain earlier, the track was still quite wet. Luckily, by lunch the sun had come out and the track was a lot drier. Altogether, we had six session each consisting of about 20 minutes. Each time I went out, I knew the track a lot better, and felt like my line was improving with every lap. I was still one of the slowest in the novice catagory - but I guess that's to be expected with me only riding bikes for a few months. Most people (even in the novice catagory) had been riding for years. There were about two or three people in the novice group who certainly shouldn't have been in this group. It was either that the intermediate group had run out of places, or they just wanted to be the fastest on the track and show off.<br />
<br />
At the end of the day, we went to look at the pictures that the <a target="new" href="http://www.fresh-orange.co.uk">track photography company</a> had taken. It was £30 for a cdrom with pictures of you on the track. You can see my pictures in my image gallery (see link at bottom of this write-up).<br />
<br />
On the way home, the traffic was terrible. On both the motorway and the A34, the traffic was stationary. Well, cars were anyway - how I love bikes ;)<br />
<br />
<br />
<br />
<strong>
<a href="http://www.dracan.co.uk/cpg134/thumbnails.php?album=16">Trackday Image Gallery</a><br />
<a href="http://www.dracan.co.uk/videos/silverstone_131105_divx.avi">Onboard video</a><br />
</strong>
<br />
</div>
<div id="article_images">
<a href="http://www.dracan.co.uk/cpg134/albums/bikes/silverstone_131105/NOV_3334.JPG"><img border="1" src="http://www.dracan.co.uk/images/silverstone_131105/me1_small.jpg" alt="" /></a><br />
<br />
<a href="http://www.dracan.co.uk/cpg134/albums/bikes/silverstone_131105/NOV_1964.JPG"><img border="1" src="http://www.dracan.co.uk/images/silverstone_131105/me2_small.jpg" alt="" /></a><br />
<br />
<a href="http://www.dracan.co.uk/cpg134/albums/bikes/silverstone_131105/AVD_2412.JPG"><img border="1" src="http://www.dracan.co.uk/images/silverstone_131105/me3_small.jpg" alt="" /></a><br />
<br />
<a href="http://www.dracan.co.uk/cpg134/albums/bikes/silverstone_131105/DSC01480.JPG"><img border="1" src="http://www.dracan.co.uk/images/silverstone_131105/tt_small.jpg" alt="" /></a><br />
<br />
<a href="http://www.dracan.co.uk/cpg134/albums/bikes/silverstone_131105/DSC01460.JPG"><img border="1" src="http://www.dracan.co.uk/images/silverstone_131105/bikes_small.jpg" alt="" /></a><br />
</div>
<div class="clear"></div>
</div>
</div>
</body>
</html>
The first thing I did and you should always think of is to have a doctype in the beginning of your document. And be aware that there must not be anything (not even a white space or line break) before that.
One important thing I did is adding another div around those two #article_left and #article_images divs as a container. This way it's easier to set a border to it and make it look even when floating them.
When floating an element it is taken out of the natural flow of elements and the containing element will collapse as if there was no content. To fix this I added an empty clearing div and applied the property clear: both; to it. It will now continue underneath the floated elements as it should (both means left and right float are cleared) and drags the containing element's border downwards.
You just have to apply the font styling now and tadaa, were done. :D
Hope that is clearing some things? :)
Happy coding. ;)
P.S.: Also look what I did to the header.
And change the border and background color to your desired color. I just made them blue and black for now.