Losing relative spacing in nested <div>

I am using nested <div> statements where the parent is set position:absolute, and the child position:relative.

Now I have 6 new module positions (with the left reflecting the look of the right side) and the child <div>s basically reflecting each other code wise.

I can't figure out why the bottom two modules don't space 30px from the ones above them as is set in the css.  Please see attached code and pic for details.

Any help would be great.  Richard.
----------------------------------------TEMPLATE CODE-------------------------------------------
<body>	

<center>
<div id="container">

	<div id="gk_wrapper">
	
		<?php 
			// including register form file
			include_once(JPATH_ROOT . "/templates/" . $this->template->template . '/lib/php/login.php');
			// including register form file
			include_once(JPATH_ROOT . "/templates/" . $this->template->template . '/lib/php/register.php'); 
		?>
	
		<?php $this->loadBlock("gk_header"); ?>
		
		<?php $this->loadSkeleton("default"); ?>
	
		<?php $this->loadBlock("gk_bottom"); ?>
	
		<?php $this->loadBlock("gk_footer"); ?>
		
	</div>

  <div id="adsleft">
    <div id="adsleft1"><jdoc:include type="modules" name="adsleft1" /></div>
    <div id="adsleft2"><jdoc:include type="modules" name="adsleft2" /></div>
    <div id="adsleft3"><jdoc:include type="modules" name="adsleft3" /></div>
  </div>

  <div id="adsright">	
    <div id="adsright1"><jdoc:include type="modules" name="adsright1" /></div>
    <div id="adsright2"><jdoc:include type="modules" name="adsright2" /></div>
    <div id="adsright3"><jdoc:include type="modules" name="adsright3" /></div>
  </div>

</div>
</center>
	
	<jdoc:include type="modules" name="debug" />
	
	<?php if($this->template->params->get('font_method',1) == 0) : ?>
	<script type="text/javascript"> Cufon.now(); </script>
	<?php endif; ?>
</body>

----------------------------------------END TEMPLATE-------------------------------------------




----------------------------------------CSS CODE-------------------------------------------
/* CSS */

div#gk_wrapper{
	margin: 0 auto;
}

/* Richard new classes for side ads */

/* The whole container for the left ads, middle joomla, and right ads */
div#container{
	position:relative;
	width:1240px;
}

/* The left ads including main container and individula module styles */
div#adsleft{
	position:absolute;
        top:28px;
	left:0px;
	width:115px;
}
div#adsleft1{
	position:relative;
        top:0px;
        height:250px;
}
div#adsleft2{
	position:relative;
        top:30px;
        height:250px;
        }
div#adsleft3{
	position:relative;
        top:30px;
}

/* The right ads including main container and individula module styles */
div#adsright{
	position:absolute;
        top:28px;
	right:0px;
	width:115px;
}
div#adsright1{
	position:relative;
        top:0px;
        height:250px;
}
div#adsright2{
	position:relative;
        top:30px;
        height:250px;
        }
div#adsright3{
	position:relative;
        top:30px;
}

----------------------------------------END CSS-------------------------------------------

Open in new window

scrn-shot-relative-space-pr.jpg
chinatrumpetAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

LZ1Commented:
Do you have a live link you could share possibly?  If your worried about Google crawling it, then you could use a url shortner like bitly.
http://bit.ly/ 
0
chinatrumpetAuthor Commented:
Shortened url:   http://is.gd/bCR6p

Thanks.
0
Dave BaldwinFixer of ProblemsCommented:
Which CSS file are adsleft and adsright defined in?  You have too many to look thru.
0
LZ1Commented:
In your layout.css you have all of your ads divs with a position of relative along with a declaration of top:30px.  Take out that top 30px out of the ads2 and ads3 and you should be fine.
The top declaration is reserved for absolute and fixed positioning.  If you need to position relatively, you should use the margin declaration instead.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.