CSS Drop Down Menu not working

[dananeal]

My drop down menu in IE 7 and IE 6 is not working. It works on IE8. Here is a link to the page and I’ll paste my css code below. Would appreciate any help with this.

http://cwservices.dananealdesigns.com/

Thanks!

@charset “UTF-8”;
/* CSS Document */
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* it’s good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #666;
background-color: #FFF;
}
.thrColFixHdr #container {
width: 960px;
text-align: left; /* this overrides the text-align: center on the body element. */
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
background-color: #CCC;
}
.thrColFixHdr #header {
background-color: #FFF;
padding-top: 0;
padding-right: 10px;
padding-bottom: 0;
padding-left: 0px;
}
.thrColFixHdr #header h1 {
margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse – an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
.thrColFixHdr #sidebar1 {
float: left; /* since this element is floated, a width must be given */
width: 150px; /* the background color will be displayed for the length of the content in the column, but no further */
padding: 15px 10px 15px 20px; /* padding keeps the content of the div away from the edges */
margin-left: 8px;
background-color: #CCC;
}
.thrColFixHdr #sidebar2 {
float: right; /* since this element is floated, a width must be given */
width: 160px; /* the background color will be displayed for the length of the content in the column, but no further */
padding: 15px 10px 15px 20px; /* padding keeps the content of the div away from the edges */
margin-right: 15px;
background-color: #CCC;
}
.thrColFixHdr #mainContent {
background-color: #CCC;
border-left: 2px;
border-color: #000;
margin-top: 0;
margin-right: 210px;
margin-bottom: 0;
margin-left: 190px;
padding-top: 0;
padding-right: 10px;
padding-bottom: 0;
padding-left: 10px;
border-left-style: solid;
border-right-color: #000;
border-right-width: 2px;
border-right-style: solid;
}
.thrColFixHdr #footer {
text-align: center;
background-color: #FFF;
}
.thrColFixHdr #footer p {
margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse – a space between divs */
padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
float: right;
margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
float: left;
margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
.smallheader {
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
font-weight: bold;
color: #333;
line-height: normal;
letter-spacing: normal;
}
.smallnavtext {
font-family: Verdana, Geneva, sans-serif;
font-size: 10px;
font-weight: normal;
color: #999;
}
.copyrighttext {
font-family: Verdana, Geneva, sans-serif;
font-size: 9px;
font-weight: normal;
color: #999;
}
.largersubheadsunderline {
font-family: Verdana, Geneva, sans-serif;
font-size: 16px;
font-style: normal;
line-height: normal;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #333;
text-decoration: underline;
}

[davidlab.be]

wow…start with css shorthand to make life easier.

[Author]

Posts