I'm trying to redesign a template that I plan on using for each page in my website. The problem is that I am using layers, and if the window is resized, or the user changes text size, some of the body layer and the bottom layer overlap. I would like instead that the bottom layer move down.<br />
<br />
Any ideas on this would be very helpful. <br />
<br />
You can find the html code here. None of the images or links are included, so it'll look ugly. Still, just make the width of the broswer window smaller and you should see that the text of the body overlapps the text of the bottom layer. <br />
<br />
<!-- m --><a class="postlink" href="http://www.worth1000.com/web/media/8724/copy.html">http://www.worth1000.com/web/media/8724/copy.html</a><!-- m --><br />
<br />
Thank You<!--content-->Make layer7 absolutely positioned, but relative to layer6 by wrapping it inside layer6.<br />
<br />
e.g.<br />
<br />
<div id="Layer6" style="position:absolute; left:152px; top:53px; ...><br />
<br />
<div id="Layer7" style="position:absolute; left:0px; top:100px; ...<br />
<br />
</div> <!-- this is end of layer 7<br />
<br />
<br />
</div> <!-- this is end of layer 6<br />
<br />
<br />
In this way Layer7 will take it's coordinates from the Layer6 and not from the page. You can also use negative figures, e.g. left: -152px if you like.<!--content-->Yeah, that would've been my first guess too. However, because of it's "absoluteness", it still doesn't move with the text and such when inside layer 6. I've posted your idea and it's result here:<br />
<br />
<!-- w --><a class="postlink" href="http://www.wroth1000.com/web/media/8724/copy_2.html">www.wroth1000.com/web/media/8724/copy_2.html</a><!-- w --><br />
<br />
Unless I've done your suggestion incorrectly, I thank you for the attempt and encourage any other ideas you may have.<br />
<br />
Thanks,<!--content-->
<br />
Any ideas on this would be very helpful. <br />
<br />
You can find the html code here. None of the images or links are included, so it'll look ugly. Still, just make the width of the broswer window smaller and you should see that the text of the body overlapps the text of the bottom layer. <br />
<br />
<!-- m --><a class="postlink" href="http://www.worth1000.com/web/media/8724/copy.html">http://www.worth1000.com/web/media/8724/copy.html</a><!-- m --><br />
<br />
Thank You<!--content-->Make layer7 absolutely positioned, but relative to layer6 by wrapping it inside layer6.<br />
<br />
e.g.<br />
<br />
<div id="Layer6" style="position:absolute; left:152px; top:53px; ...><br />
<br />
<div id="Layer7" style="position:absolute; left:0px; top:100px; ...<br />
<br />
</div> <!-- this is end of layer 7<br />
<br />
<br />
</div> <!-- this is end of layer 6<br />
<br />
<br />
In this way Layer7 will take it's coordinates from the Layer6 and not from the page. You can also use negative figures, e.g. left: -152px if you like.<!--content-->Yeah, that would've been my first guess too. However, because of it's "absoluteness", it still doesn't move with the text and such when inside layer 6. I've posted your idea and it's result here:<br />
<br />
<!-- w --><a class="postlink" href="http://www.wroth1000.com/web/media/8724/copy_2.html">www.wroth1000.com/web/media/8724/copy_2.html</a><!-- w --><br />
<br />
Unless I've done your suggestion incorrectly, I thank you for the attempt and encourage any other ideas you may have.<br />
<br />
Thanks,<!--content-->