nsteele84
asked on
How to dynamically move divs in Dreamweaver
Hi
I am developing a site which you can find here:
http://www.greatfindcollectibles.com/
My question is the div that holds the menu can grow and shrink depending on how many items there are in the database. How can I make the divs Search and Mailing list move up and down depending on the height of the menu div?
Thanks
Nick Steele
I am developing a site which you can find here:
http://www.greatfindcollectibles.com/
My question is the div that holds the menu can grow and shrink depending on how many items there are in the database. How can I make the divs Search and Mailing list move up and down depending on the height of the menu div?
Thanks
Nick Steele
Set the position: relative; on the menu div. This makes the position of lower divs 'relative' to that one.
ASKER
Unfortunately when I do that the auto height does not work
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Set the position of the Mailing List and Search div to "relative" also (You will need to play with positioning abit).
Here, I played with the positioning -- try this in place of your current CSS:
<style type="text/css">
<!--
#container {
background-color: #FFF;
height: 900px;
width: 870px;
margin-right: auto;
margin-left: auto;
position: relative;
text-align: left;
}
#body {
text-align: center;
background-color: #FFF;
}
body {
background-image: url(images/gradfill.jpg);
background-color: #255980;
}
#Logo {
position:absolute;
left:6px;
top:3px;
width:853px;
height:257px;
z-index:1;
border: thin solid #000;
}
#Categories {
position:relative;
left:8px;
top:269px;
width:189px;
min-height:80px;
z-index:2;
border: thin solid #000;
height: auto;
}
#CategoriesInner {
position:relative;
width:189px;
min-height:80px;
height:auto;
}
#Cart {
position:absolute;
left:657px;
top:269px;
width:200px;
height:65px;
z-index:3;
border: thin solid #000;
}
#Search {
position:relative;
left:7px;
top:275px;
width:191px;
height:73px;
z-index:4;
border: thin solid #000;
}
#Featured {
position:absolute;
left:657px;
top:418px;
width:200px;
height:460px;
z-index:5;
border: thin solid #000;
}
#MainArea {
position:absolute;
left:211px;
top:269px;
width:432px;
height:610px;
z-index:6;
border: thin solid #000;
overflow:scroll
}
#Account {
position:absolute;
left:658px;
top:343px;
width:201px;
height:66px;
z-index:7;
border: thin solid #000;
}
#MailingList {
position:relative;
left:7px;
top:280px;
width:192px;
height:71px;
z-index:8;
border: thin solid #000;
}
-->
</style>
ASKER
Thanks to everyone for help