div rekt niet mee

Hallo,

Ik heb nu een heel raar probleem, ik hem mijn photoshop ontwerp gebased en nu is het feit dat er een border omheen moet. De content heb ik in 1 div gezet genaamd content, hierin zit dan weer meerdere divs (met het float attribuut dat roet in het eten gooit). Het probleem is dat de content div niet hoger/lager wordt (en dus de rand groter maakt. Ik zal de bijbehorende code posten

HTML:

<div id="content">
    	<div class="categorie">
        	<div class="categorie-top">
            	Auto's
            </div>
            <div class="links">
            	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas nulla ligula, faucibus ac sodales et, porta in erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla nibh lectus, imperdiet gravida pharetra in, condimentum et dolor. Nam vestibulum leo quis nisi sodales nec porttitor massa mollis. Duis facilisis, libero nec ultrices placerat, ante diam tincidunt turpis, imperdiet sollicitudin velit eros non augue. Duis a lorem eu massa ultricies dapibus quis semper magna. Integer et leo id velit accumsan congue. Proin eget neque metus. Curabitur rhoncus, felis in tincidunt venenatis, arcu est dignissim ipsum, non lacinia neque sapien at mauris. Sed ullamcorper viverra ipsum id condimentum. Nulla vitae orci tortor, vel tristique quam. Morbi molestie, libero sed dictum venenatis, nunc diam tincidunt magna, nec rutrum lacus dui nec metus.
            </div>
            <div class="endlinks"></div>
        </div>
        <div class="categorie">
        	<div class="categorie-top">
            	Computers
            </div>
            <div class="links">
            	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas nulla ligula, faucibus ac sodales et, porta in erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla nibh lectus, imperdiet gravida pharetra in, condimentum et dolor. Nam vestibulum leo quis nisi sodales nec porttitor massa mollis. Duis facilisis, libero nec ultrices placerat, ante diam tincidunt turpis, imperdiet sollicitudin velit eros non augue. Duis a lorem eu massa ultricies dapibus quis semper magna. Integer et leo id velit accumsan congue. Proin eget neque metus. Curabitur rhoncus, felis in tincidunt venenatis, arcu est dignissim ipsum, non lacinia neque sapien at mauris. Sed ullamcorper viverra ipsum id condimentum. Nulla vitae orci tortor, vel tristique quam. Morbi molestie, libero sed dictum venenatis, nunc diam tincidunt magna, nec rutrum lacus dui nec metus.
            </div>
        	<div class="endlinks"></div>
        </div>
        <div class="categorie">
        	<div class="categorie-top">
            	Reclame
            </div>
            <div class="links">
            	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas nulla ligula, faucibus ac sodales et, porta in erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla nibh lectus, imperdiet gravida pharetra in, condimentum et dolor. Nam vestibulum leo quis nisi sodales nec porttitor massa mollis. Duis facilisis, libero nec ultrices placerat, ante diam tincidunt turpis, imperdiet sollicitudin velit eros non augue. Duis a lorem eu massa ultricies dapibus quis semper magna. Integer et leo id velit accumsan congue. Proin eget neque metus. Curabitur rhoncus, felis in tincidunt venenatis, arcu est dignissim ipsum, non lacinia neque sapien at mauris. Sed ullamcorper viverra ipsum id condimentum. Nulla vitae orci tortor, vel tristique quam. Morbi molestie, libero sed dictum venenatis, nunc diam tincidunt magna, nec rutrum lacus dui nec metus.
            </div>
        	<div class="endlinks"></div>
        </div>   
    </div>

De categorie div scaled wel mee met de lorem ipsum maar de content div scaled niet met de categorie div.

CSS:

#content{
	display: block;
	width: 768px;
	background-image: url(../img/pageborder.png);
	background-repeat: repeat-y;
	padding: 0 39px 0 39px;
}
.categorie{
	float:left;
	display:block;
	padding: 15px 35px 0 0;
	width:200px;
}
.categorie-top{
	padding: 4px 0 0 0;
	width: 200px;
	height: 28px;
	background-image: url(../img/categoriebg.png);
	background-repeat:repeat-x;
	color: #fff;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}
.links{
	width: 196px;
	padding: 3px;
	background-image:url(../img/link-border.png);
	background-repeat:repeat-y;
}
.endlinks{
	float:none;
	clear:both;
	padding: 0;
	margin: 0;
	height: 2px;
	background-image:url(../img/link-end.png);	
	background-repeat: no-repeat;
}

Hopelijk kan iemand mij helpen