No replies
cgoodman13
Offline
newbie
Glen Ellen California
Last seen: 13 years 26 weeks ago
Glen Ellen California
Joined: 2009-05-29
Posts: 1
Points: 0

Hello all,

I have inserted this dropdown menu using relative positioning, but now everything else in the layout has moved down. I checked the margins on all of the divs and I can't seem to figure out why everything is moving down in the layout from the menu, and the "SIGN UP TO RECEIVE
TRIBUTE NEWSLETTER" text. Can anyone figure this out?

here's the link: http://www.tributewine.com/construction/index_new.html

CSS for dropdown menu:
/* Begin CSS Drop Down Menu */

#menuh-container
{
position: relative;
margin-right: 120px;
margin-left: 40px;
top: -60px;
left: -20px;
z-index: 500;
margin-bottom: 0px;
}

#menuh
{
font-size: small;
font-family: arial, helvetica, sans-serif;
width:100%;
float:left;
margin:2em;
margin-top: 20px;
}

#menuh a
{
text-align: center;
display:block;
border: 1px solid #555;
white-space:nowrap;
margin:0;
padding: 0.3em;
}

#menuh a:link, #menuh a:visited, #menuh a:active /* menu at rest */
{
color: white;
background-color: #B5A081;
text-decoration:none;
}

#menuh a:hover /* menu on mouse-over */
{
color: white;
background-color: #776962;
text-decoration:none;
}

#menuh a.top_parent, #menuh a.top_parent:hover /* attaches down-arrow to all top-parents */
{
background-image: url(file:///C|/Users/CGoodman.BENZIGER/AppData/Local/Microsoft/Windows/Temporary%20Internet%20Files/Content.IE5/X317ZQZ3/navdown_white.gif);
background-position: right center;
background-repeat: no-repeat;
}

#menuh a.parent, #menuh a.parent:hover /* attaches side-arrow to all parents */
{
background-image: url(file:///C|/Users/CGoodman.BENZIGER/AppData/Local/Microsoft/Windows/Temporary%20Internet%20Files/Content.IE5/X317ZQZ3/nav_white.gif);
background-position: right center;
background-repeat: no-repeat;
}

#menuh ul
{
list-style:none;
margin:0;
padding:0;
float:left;
width:9em; /* width of all menu boxes */
/* NOTE: For adjustable menu boxes you can comment out the above width rule.
However, you will have to add padding in the "#menh a" rule so that the menu boxes
will have space on either side of the text -- try it */
}

#menuh li
{
position:relative;
min-height: 1px; /* Sophie Dennis contribution for IE7 */
vertical-align: bottom; /* Sophie Dennis contribution for IE7 */
}

#menuh ul ul
{
position:absolute;
z-index:500;
top:auto;
display:none;
padding: 1em;
margin:-1em 0 0 -1em;
}

#menuh ul ul ul
{
top:0;
left:100%;
}

div#menuh li:hover
{
cursor:pointer;
z-index:100;
}

div#menuh li:hover ul ul,
div#menuh li li:hover ul ul,
div#menuh li li li:hover ul ul,
div#menuh li li li li:hover ul ul
{display:none;}

div#menuh li:hover ul,
div#menuh li li:hover ul,
div#menuh li li li:hover ul,
div#menuh li li li li:hover ul
{display:block;}

/* End CSS Drop Down Menu */

CSS for page layout:

@charset "utf-8";
/* CSS Document */

/*allpages*/

a {
font-family: Georgia, Times New Roman, Times, serif;
font-size: 11px;
color: #3B2314;
letter-spacing: 1px;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #000000;
}
a:hover {
text-decoration: underline;
color: #B5A081;
}
a:active {
text-decoration: none;
}

body {
background-color: #3b2314;
line-height: 1.2em;
letter-spacing: .25px;
}

h1 {
font-family: Georgia, "Times New Roman", Times, serif;
color: #3B2314;
font-size: 19px;
border-bottom: 1px dotted #897B72;
letter-spacing: 1px;
}

h2 {
font-family: Georgia, "Times New Roman", Times, serif;
color: #3B2314;
font-size: 15px;
letter-spacing: 1px;
}

.special {
font-family: Georgia, "Times New Roman", Times, serif;
color: #936818;
font-size: 14px;
letter-spacing: 1px;
margin-bottom: 0;
}

p {
font-family: Arial, Helvetica, sans-serif;
color: #776962;
font-size: 12px;
}

#allcontent {
background-color: #f9f2d8;
width: 1050px;

margin: 0 auto;
}

#header {
/*margin: 0 auto;*/
margin-bottom: 40px;
width: 1050px;
text-align: center;
}

#footer {
border: solid 1px #3B2314;
clear: both;
margin-left: 40px;
margin-right: 40px;
padding: 2px;
}

#footerinner {
border: solid 1px #3B2314;
clear: both;
padding: 2px;
margin: 2px;
background-color: #ddd4bc;
line-height: normal;
}

.footernav {
font-family: Arial, Helvetica, sans-serif;
color: #776962;
font-size: 12px;
margin: 2px;
text-align: center;
}

.copyright {
font-family: Arial, Helvetica, sans-serif;
color: #776962;
font-size: 9px;
margin: 5px;
text-align: center;
}

#bottomimage {
background-color: #3b2314 ;
height: 21px;
width: 1050px;
}

#navigation {
margin-left: 30px;
width: 1050px;
}

#signup {
position: relative;
z-index: 500;
left: 850px;
top: 0px;
width: 200px;
}

.signup {
font-family: Georgia, Times New Roman, Times, serif;
font-size: 11px;
color: #3B2314;
letter-spacing: .5px;
text-decoration: none;
font-weight: bold;

}

/*index page*/

#outerlefttopbox {
width: 180px;
border: solid 1px #3B2314;
padding: 5px;
margin-left: 40px;
margin-top: 20px;

}

#outerlefttopbox2 {
width: 180px;
border: solid 1px #3B2314;
padding: 5px;
margin-left: 40px;
margin-top: 20px;
}

#lefttopbox {
border: solid 1px #936818;
padding: 10px;
background-color: #FFFFFF;
}

#outercentercolumn {
border: solid 1px #3B2314;
padding: 15px;
padding-right: 20px;
background-color: #FFFFFF;
width: 480px;
float: right;
margin-bottom: 20px;
margin-top: 0px;
margin-right: 17px;
}

#rightcolumn {
float: right;
margin-right: 40px;
margin-top: 0px;
padding: -2px;
border: solid 1px #3B2314;
background-color: white;
}

/*our story page*/

#maintextouter {
border: solid 1px #3B2314;
margin-left: 80px;
margin-right: 80px;
margin-bottom: 30px;
padding: 2px;
background-color: white;
}

#maintextinner {
margin-left: 20px;
margin-right: 20px;
}

#image {
margin-top: 40px;
margin-right: 10px;
width: 200px;
float: right;
margin-bottom: 10px;
margin-left: 20px;
}

Thank you!
Cindy