Hi there,

I am having a problem with my CSS -

I have a page within it there is a id element called 'maincontent'. This is in a fixed position on the page and it doesn't automatically move up when an element above it is removed.

Page where element above 'main content' element has been removed

Code:
<html>
<head>
<style>
body{background-color:#939da4;padding-top:7px;}
.container{width:750px;margin:0px auto;background-color:#ffffff;border:solid 2px #bcbcbc;}
.header{width:740px;height:85px;background:url(images/header.jpg);margin:5px;}
#login {height:56px;float:left;background-color:#aaaaaa;margin-left:5px;margin-right:5px;display:inline;border:solid 1px #bcbcbc;}
#date {height:25px;background-color:#dadada;margin-left:5px;margin-top:-33px;border:solid 1px #bcbcbc; }

#date,#login,#pridebulleted,#pridetitle,#latestnewstitle,#latestnews,#testimonial{width:233px;}
#pridetitle{height:32px;background-color:#d6d6d6;margin-top:5px;margin-left:5px;border:solid 1px #d6d6d6;background:url(images/home/titles/weprideourselveson.jpg);}
#pridebulleted{height:88px;margin-left:5px;border:solid 1px #aaaaaa;background:url(images/misc/weprideourselveson_bulletedlist.jpg) center no-repeat;background-color:#aaaaaa;}

#latestnewstitle{height:28px;background-color:#436e83;margin-left:5px;border:solid 1px #436e83;margin-top:5px;background:url(images/titles/latestnews.jpg);}
#latestnews{height:180px;border:solid 1px #bcbcbc;margin-left:5px;}

#head-ad{width:500px;height:124px;background:url(images/heads/spanner.jpg);float:right;margin-right:5px;margin-top:5px;}

#maincontent{width:500px;float:right;margin-right:5px;margin-top:5px;}

#maincontent-text{width:310px;}

#maincontent-text h1{font-family:Arial;font-size:11px;color:#666666;float:left;font-weight:normal;line-height:15px;margin-left:10px;}

#maincontent-girl{height:212px;width:190px;background:url(images/misc/girlholdinghips.jpg);float:right;}

#testimonial{height:147px;border:solid 1px #bcbcbc;margin-left:5px;margin-top:5px;}

#pgbtm-titlecontainer,#pgbtm-textcontainer{width:245px;}

#pgbtm-titlecontainer{height:28px;background-color:#999999;margin-right:5px;}

#pgbtm-textcontainer{height:122px;border:solid 1px #bcbcbc;margin-right:5px;}



#pgbtm-textcontainer-sidetext{width:120px;float:left;}

#pgbtm-textcontainer-sidetext h1{font-family:Arial;font-size:12px;color:#ff0000;font-weight:bold;margin-left:5px;}

#pgbtm-textcontainer-sidetext h2{font-family:Arial;font-size:11px;color:#333333;font-weight:normal;margin-top:-5px;margin-left:5px;}

.pgbtm-container{float:right;}

#footer{width:740px;height:50px;background:url(images/misc/footer.png);margin-left:5px;margin-top:5px;margin-bottom:5px;}

#latestnews h1 {font-family:Arial;color:#333333;font-size:11px;font-weight:bold;margin-left:15px;}

#latestnews h2 {font-family:Arial;color:#333333;font-size:11px;font-weight:normal;margin-left:15px;margin-top:-8px;}

.imgthumb{margin:8px;float:left;border:solid 1px #bcbcbc;}




/* BUTTONS */

#navlinks {margin:0px; padding:0px;}

#navlinks li {
	list-style: none;
	display: inline;}





</style>
</head>

<body>
<div class="container">
<div class="header"></div>

<div id="login"></div>

<ul id="navlinks">
<li><img src="images/buttons/home.jpg"></li>
<li><img src="images/buttons/aboutus.jpg"> </li>
<li><img src="images/buttons/services.jpg"> </li>

<li><img src="images/buttons/contact.jpg"> </li>
<li><img src="images/buttons/links.jpg"> </li>
</ul>

<div id="date"></div>


<div id="pridetitle"></div>
<div id="pridebulleted"></div>

<div id="maincontent">
<div id="maincontent-text">
<h1>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam diam. Nam rhoncus massa vitae libero. Vestibulum enim tortor, condimentum blandit, eleifend quis, rutrum et, ante. Vestibulum placerat tellus quis turpis. Morbi lacus lacus, vulputate a, commodo sit amet, euismod nec, nisi. Nullam vitae purus. Etiam vitae nisl. Phasellus laoreet risus eu ligula. 

Aenean lacus quam, fringilla quis, mollis sed, auctor in, erat. Integer placerat urna sed augue. Aenean porta felis sit amet orci. Donec imperdiet velit vel odio. Morbi at nunc quis risus bibendum facilisis.
</h1>

</div>
<div id="maincontent-girl"></div></div>

<div id="latestnewstitle"></div>
<div id="latestnews">
<h1>20/06/2006 - Site is now live</h1><h2>This website is now complete and running</h2><h1>19/06/2006 - brilliant</h1><h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas pede mi, ullamcorper eu, bibendum nec, pretium vel, massa.</h2><h1>17/06/2006 - An amazing site -period</h1><h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas pede mi, ullamcorper eu,</h2>


</div>

<div class="pgbtm-container">

<div id="pgbtm-titlecontainer"></div>
<div id="pgbtm-textcontainer"></div>
</div>

<div class="pgbtm-container">
<div id="pgbtm-titlecontainer"><img src="images/titles/featuredservice.jpg"></div>
<div id="pgbtm-textcontainer">
<div class="imgthumb"><img width=95 height=95 src="images/services/SEO.jpg" alt="You should never underestimate the importance of SEO - that's why we don't"/></div><div id="pgbtm-textcontainer-sidetext"><h1>Search Engine Optimisation (SEO)</h1><h2>You should never underestimate the importance of SEO - that's why we don't</h2></div>

</div>
</div>


<div id="testimonial"><img src="images/misc/quote_home.png"></div>

<div id="footer"></div>

</div>



</body>

</html>
Page where element above 'main content' element has been fixed in place

Code:
<html>
<head>
<style>
body{background-color:#939da4;padding-top:7px;}
.container{width:750px;margin:0px auto;background-color:#ffffff;border:solid 2px #bcbcbc;}
.header{width:740px;height:85px;background:url(images/header.jpg);margin:5px;}
#login {height:56px;float:left;background-color:#aaaaaa;margin-left:5px;margin-right:5px;display:inline;border:solid 1px #bcbcbc;}
#date {height:25px;background-color:#dadada;margin-left:5px;margin-top:-33px;border:solid 1px #bcbcbc; }

#date,#login,#pridebulleted,#pridetitle,#latestnewstitle,#latestnews,#testimonial{width:233px;}
#pridetitle{height:32px;background-color:#d6d6d6;margin-top:5px;margin-left:5px;border:solid 1px #d6d6d6;background:url(images/home/titles/weprideourselveson.jpg);}
#pridebulleted{height:88px;margin-left:5px;border:solid 1px #aaaaaa;background:url(images/misc/weprideourselveson_bulletedlist.jpg) center no-repeat;background-color:#aaaaaa;}

#latestnewstitle{height:28px;background-color:#436e83;margin-left:5px;border:solid 1px #436e83;margin-top:5px;background:url(images/titles/latestnews.jpg);}
#latestnews{height:180px;border:solid 1px #bcbcbc;margin-left:5px;}

#head-ad{width:500px;height:124px;background:url(images/heads/spanner.jpg);float:right;margin-right:5px;margin-top:5px;}

#maincontent{width:500px;float:right;margin-right:5px;margin-top:5px;}

#maincontent-text{width:310px;}

#maincontent-text h1{font-family:Arial;font-size:11px;color:#666666;float:left;font-weight:normal;line-height:15px;margin-left:10px;}

#maincontent-girl{height:212px;width:190px;background:url(images/misc/girlholdinghips.jpg);float:right;}

#testimonial{height:147px;border:solid 1px #bcbcbc;margin-left:5px;margin-top:5px;}

#pgbtm-titlecontainer,#pgbtm-textcontainer{width:245px;}

#pgbtm-titlecontainer{height:28px;background-color:#999999;margin-right:5px;}

#pgbtm-textcontainer{height:122px;border:solid 1px #bcbcbc;margin-right:5px;}



#pgbtm-textcontainer-sidetext{width:120px;float:left;}

#pgbtm-textcontainer-sidetext h1{font-family:Arial;font-size:12px;color:#ff0000;font-weight:bold;margin-left:5px;}

#pgbtm-textcontainer-sidetext h2{font-family:Arial;font-size:11px;color:#333333;font-weight:normal;margin-top:-5px;margin-left:5px;}

.pgbtm-container{float:right;}

#footer{width:740px;height:50px;background:url(images/misc/footer.png);margin-left:5px;margin-top:5px;margin-bottom:5px;}

#latestnews h1 {font-family:Arial;color:#333333;font-size:11px;font-weight:bold;margin-left:15px;}

#latestnews h2 {font-family:Arial;color:#333333;font-size:11px;font-weight:normal;margin-left:15px;margin-top:-8px;}

.imgthumb{margin:8px;float:left;border:solid 1px #bcbcbc;}




/* BUTTONS */

#navlinks {margin:0px; padding:0px;}

#navlinks li {
	list-style: none;
	display: inline;}





</style>
</head>

<body>
<div class="container">
<div class="header"></div>

<div id="login"></div>

<ul id="navlinks">
<li><img src="images/buttons/home.jpg"></li>
<li><img src="images/buttons/aboutus.jpg"> </li>
<li><img src="images/buttons/services.jpg"> </li>

<li><img src="images/buttons/contact.jpg"> </li>
<li><img src="images/buttons/links.jpg"> </li>
</ul>

<div id="date"></div>
<div id="head-ad"></div>

<div id="pridetitle"></div>
<div id="pridebulleted"></div>

<div id="maincontent">
<div id="maincontent-text">
<h1>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam diam. Nam rhoncus massa vitae libero. Vestibulum enim tortor, condimentum blandit, eleifend quis, rutrum et, ante. Vestibulum placerat tellus quis turpis. Morbi lacus lacus, vulputate a, commodo sit amet, euismod nec, nisi. Nullam vitae purus. Etiam vitae nisl. Phasellus laoreet risus eu ligula. 

Aenean lacus quam, fringilla quis, mollis sed, auctor in, erat. Integer placerat urna sed augue. Aenean porta felis sit amet orci. Donec imperdiet velit vel odio. Morbi at nunc quis risus bibendum facilisis.
</h1>

</div>
<div id="maincontent-girl"></div></div>

<div id="latestnewstitle"></div>
<div id="latestnews">
<h1>20/06/2006 - Site is now live</h1><h2>This website is now complete and running</h2><h1>19/06/2006 - brilliant</h1><h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas pede mi, ullamcorper eu, bibendum nec, pretium vel, massa.</h2><h1>17/06/2006 - An amazing site -period</h1><h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas pede mi, ullamcorper eu,</h2>


</div>

<div class="pgbtm-container">

<div id="pgbtm-titlecontainer"></div>
<div id="pgbtm-textcontainer"></div>
</div>

<div class="pgbtm-container">
<div id="pgbtm-titlecontainer"><img src="images/titles/featuredservice.jpg"></div>
<div id="pgbtm-textcontainer">
<div class="imgthumb"><img width=95 height=95 src="images/services/SEO.jpg" alt="You should never underestimate the importance of SEO - that's why we don't"/></div><div id="pgbtm-textcontainer-sidetext"><h1>Search Engine Optimisation (SEO)</h1><h2>You should never underestimate the importance of SEO - that's why we don't</h2></div>

</div>
</div>


<div id="testimonial"><img src="images/misc/quote_home.png"></div>

<div id="footer"></div>

</div>



</body>

</html>
Anyone know a way to do this? I don't particularly want to create a new div ID and use negative margins - any other ways, guys?

Cheers for the help

James