anirban.be
Joined: 10 Apr 2008
Posts: 1
Location: Navi Mumbai
|
 Posted: Thu Apr 10, 2008 12:14 pm Post subject: Facing problem in IE6 for my css dropdown menu.. pls help me |
 |
|
|
I have made this menu for my site, its working properly in all browser but not working in ie6. Please tell me the soluttion....
This is my html part of the menu...----------------------------------------------------------
<div id="topnavpart" align="center">
<div id="main" align="center">
<div id="menu">
<ul>
<li><a class="hide" href="#">My Family </a>
<ul>
<li><a href="#">Child Care » </a>
<ul>
<li><a href="#">Provider Search » </a>
<ul>
<li><a href="#">Centers & Family Child Care </a></li>
<li><a href="#">In-Home Child Care </a></li>
</ul>
</li>
<li><a href="#">WFB Notes </a></li>
<li><a href="#">Backup Childcare<br />
Twin Cities </a></li>
<li><a href="#">Sick Childcare<br />
Twin Cities </a></li>
</ul>
</li>
<li><a href="#">Adult/Elder Care » </a>
<ul>
<li><a href="#">Provider Search » </a>
<ul>
<li><a href="#">Nursing Homes </a></li>
<li><a href="#">Residential </a></li>
<li><a href="#">Home Health Care </a></li>
</ul>
</li>
<li><a href="#">WFB Notes </a></li>
<li><a href="#">Medicare » </a>
<ul>
<li><a href="#">Eligibility </a></li>
<li><a href="#">Enrollment </a></li>
<li><a href="#">Medicare Parts </a></li>
<li><a href="#">Medigap </a></li>
<li><a href="#">Be an Educated Medicare Consumer </a></li>
</ul>
</li>
<li><a href="#">Medicaid </a></li>
</ul>
</li>
<li><a href="#">Adoption
» </a>
<ul>
<li><a href="#">Resource Links </a></li>
<li><a href="#">WFB Notes </a></li>
</ul>
</li>
<li><a href="#">Schools » </a>
<ul>
<li><a href="#">Links </a></li>
<li><a href="#">WFB Notes </a></li>
<li><a href="#">Search </a></li>
</ul>
</li>
<li><a href="#">College
» </a>
<ul>
<li><a href="#">Locating </a></li>
<li><a href="#">Applying </a></li>
<li><a href="#">Financing </a></li>
<li><a href="#">WFB Notes </a></li>
</ul>
</li>
<li><a href="#">Pets » </a>
<ul>
<li><a href="#">Search »</a>
<ul>
<li><a href="#">Veterinarians </a></li>
<li><a href="#">Sitters / Boarders </a></li>
<li><a href="#">Groomers </a></li>
<li><a href="#">Trainers </a></li>
</ul>
</li>
<li><a href="#">Pet Adoption </a></li>
<li><a href="#">Pet Insurance </a></li>
<li><a href="#">Resource Links </a></li>
</ul>
</li>
<li><a href="#">How To Search </a></li>
<li><a href="#">Care Library </a></li>
<li><a href="#">Test Landing </a></li>
</ul>
</li>
</ul>
<ul>
<li><a class="hide" href="#">My Health </a>
<ul>
<li><a href="#">General Health » </a>
<ul>
<li><a href="#">Articles & Videos </a></li>
<li><a href="#h">Critical Illness Links </a></li>
</ul>
</li>
<li><a href="#">Mental
Health » </a>
<ul>
<li><a href="#">Behavioral Health » </a>
<ul>
<li><a href="#">Addictions </a></li>
<li><a href="#">Anxiety </a></li>
<li><a href="#">Depression </a></li>
<li><a href="#">Eating </a></li>
<li><a href="#">Other </a></li>
<li><a href="#">Symptoms & Signs </a></li>
</ul>
</li>
<li><a href="#">Personal & Family » </a>
<ul>
<li><a href="#">Family Issues </a></li>
<li><a href="#">Grief and Loss </a></li>
<li><a href="#">Personal Growth </a></li>
<li><a href="#">Stress </a></li>
<li><a href="#">Trauma </a></li>
</ul>
</li>
<li><a href="#">Workplace Health »</a>
<ul>
<li><a href="#">Humor </a></li>
<li><a href="#">Dealing with Difficult Situations </a></li>
</ul>
</li>
<li><a href="#">Navigating the System » </a>
<ul>
<li><a href="#">Family Advocacy </a></li>
<li><a href="#">Personal Advocacy </a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Self-Help » </a>
<ul>
<li><a href="#">Health Assessments </a></li>
<li><a href="#">Real Age® Test </a></li>
<li><a href="#">Diet & Fitness Tools </a></li>
<li><a href="#">Fit Find </a></li>
<li><a href="#">Top Doctors </a></li>
<li><a href="#">Hospital Search </a></li>
<li><a href="#">No Smoking! </a></li>
<li><a href="#">Suicide: The Silent Epidemic </a></li>
<li><a href="#">Suicide </a></li>
</ul>
</li>
</ul>
</li>
</ul>
<ul>
<li><a class="hide" href="#">My
Time </a>
<ul>
<li><a href="#">Household </a></li>
<li><a href="#">Dining </a></li>
<li><a href="#">Travel </a></li>
<li><a href="#">Tourist & City </a></li>
<li><a href="#">Entertainment </a></li>
<li><a href="#">Sports & Rec. </a></li>
<li><a href="#">Shopping </a></li>
<li><a href="#">Full-Service Concierge</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
-----------------------------------------------------------------------------------
This is my css file
----------------------
<style type="text/css">
<!--
BODY {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 12px; BACKGROUND-IMAGE: url(../images/bg1_03.jpg); PADDING-BOTTOM: 0px; MARGIN: 0px; COLOR: #748493; PADDING-TOP: 0px; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-ALIGN: center
}
DIV {
FONT-SIZE: 12px; COLOR: #657178; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
P {
FONT-SIZE: 12px; COLOR: #657178; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
TH {
FONT-SIZE: 12px; COLOR: #657178; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
TD {
FONT-SIZE: 12px; COLOR: #657178; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
LI {
FONT-SIZE: 12px; COLOR: #657178; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
DD {
FONT-SIZE: 12px; COLOR: #657178; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
DL {
FONT-SIZE: 12px; COLOR: #657178; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
DT {
FONT-SIZE: 12px; COLOR: #657178; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
A {
FONT-WEIGHT: bold; COLOR: #003366; TEXT-DECORATION: none
}
A:hover {
COLOR: #22a6bf; BACKGROUND-COLOR: #ffffff
}
HR {
COLOR: #e4e4e4; BORDER-TOP-STYLE: none; BORDER-BOTTOM: #748493 1px dotted; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none
}
OL {
LIST-STYLE-IMAGE: url(../images/arrow.gif); MARGIN-LEFT: -20px; LINE-HEIGHT: 1.5em
}
LI {
LIST-STYLE-IMAGE: url(../images/arrow.gif); MARGIN-LEFT: -20px; LINE-HEIGHT: 1.5em
}
DL {
LIST-STYLE-IMAGE: url(../images/arrow.gif); MARGIN-LEFT: -20px; LINE-HEIGHT: 1.5em
}
DT {
LIST-STYLE-IMAGE: url(../images/arrow.gif); MARGIN-LEFT: -20px; LINE-HEIGHT: 1.5em
}
DD {
LIST-STYLE-IMAGE: url(../images/arrow.gif); MARGIN-LEFT: -20px; LINE-HEIGHT: 1.5em
}
P {
MARGIN-TOP: 0px; LINE-HEIGHT: 1.5em; PADDING-TOP: 0px
}
H1 {
MARGIN: 5px 0px 0px; COLOR: #666666; FONT-FAMILY: Arial, Helvetica, sans-serif
}
H2 {
MARGIN: 5px 0px 0px; COLOR: #666666; FONT-FAMILY: Arial, Helvetica, sans-serif
}
H3 {
MARGIN: 5px 0px 0px; COLOR: #666666; FONT-FAMILY: Arial, Helvetica, sans-serif
}
H4 {
MARGIN: 5px 0px 0px; COLOR: #666666; FONT-FAMILY: Arial, Helvetica, sans-serif
}
H5 {
MARGIN: 5px 0px 0px; COLOR: #666666; FONT-FAMILY: Arial, Helvetica, sans-serif
}
H6 {
MARGIN: 5px 0px 0px; COLOR: #666666; FONT-FAMILY: Arial, Helvetica, sans-serif
}
IMG {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
CODE {
BACKGROUND: none transparent scroll repeat 0% 0%; FONT: 12px "andale mono", monaco, courier, "courier new", monospace; COLOR: #06c
}
TT {
BACKGROUND: none transparent scroll repeat 0% 0%; FONT: 12px "andale mono", monaco, courier, "courier new", monospace; COLOR: #06c
}
PRE {
BACKGROUND: none transparent scroll repeat 0% 0%; FONT: 12px "andale mono", monaco, courier, "courier new", monospace; COLOR: #06c
}
.footer {
FONT-SIZE: 10px
}
.lightText {
COLOR: #b3b7ba
}
.title {
FONT-SIZE: 24px; COLOR: #0e396e; FONT-FAMILY: Georgia, "Times New Roman", Times, serif
}
.subtitle {
DISPLAY: block; FONT-SIZE: 24px; COLOR: #0e396e; BORDER-BOTTOM: #748493 1px dotted; FONT-FAMILY: Georgia, "Times New Roman", Times, serif
}
.border {
BORDER-RIGHT: #999999 5px solid; BORDER-TOP: #999999 5px solid; BORDER-LEFT: #999999 5px solid; LINE-HEIGHT: 12px; BORDER-BOTTOM: #999999 5px solid; BACKGROUND-COLOR: #ffffff
}
.tinytext {
FONT-SIZE: 9px; COLOR: #ff3366; FONT-FAMILY: Arial, Helvetica, sans-serif
}
.bartitle {
FONT-WEIGHT: bold; FONT-SIZE: 15px; COLOR: maroon; FONT-FAMILY: Georgia, "Times New Roman", Times, serif
}
.sidenav {
FONT-SIZE: 11px; LINE-HEIGHT: 12px
}
.floatRight {
FLOAT: right
}
.navshade {
PADDING-LEFT: 14px; FONT-SIZE: 9px; BACKGROUND-IMAGE: url(../images/default/nav-shade_14.jpg); PADDING-BOTTOM: 5px; PADDING-TOP: 10px; BACKGROUND-REPEAT: repeat-x; FONT-FAMILY: Arial, Helvetica, sans-serif
}
#menu-container {
LEFT: 0em; POSITION: absolute; TOP: 1em;
}
#menu {
FONT-SIZE: small; FLOAT: none; MARGIN: 0em; WIDTH: 90%; FONT-FAMILY: arial, helvetica, sans-serif;
}
#menu A {
PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; HEIGHT: auto; TEXT-ALIGN: center;
COLOR: black;
BACKGROUND-COLOR: #FADC83;
TEXT-DECORATION: none;
font-weight: normal;
font-size: 10px;
}
#menu A:visited {
COLOR: black; BACKGROUND-COLOR: #AED05E; TEXT-DECORATION: none;
}
#menu A:hover {
COLOR: black; BACKGROUND-COLOR: #C2EA68;
}
#menu A.hide {
BACKGROUND-POSITION: right center; FONT-WEIGHT: bold; FONT-SIZE: 12px; BACKGROUND-IMAGE: url(image/buttoninactivate.jpg); WIDTH: 142px; COLOR: #ffffff; PADDING-TOP: 5px; BACKGROUND-REPEAT: no-repeat; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; HEIGHT: 23px;
}
#menu A.hide:hover {
BACKGROUND-POSITION: right center; FONT-WEIGHT: bold; FONT-SIZE: 12px; BACKGROUND-IMAGE: url(image/buttonactivate.jpg); WIDTH: 142px; COLOR: #cc0000; BACKGROUND-REPEAT: no-repeat; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; HEIGHT: 23px;
}
#menu UL {
PADDING-RIGHT: 1px; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 142px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none; HEIGHT: 23px;
}
#menu LI {
MIN-HEIGHT: 1px; VERTICAL-ALIGN: bottom; POSITION: relative; MARGIN-LEFT: 0px;
}
#menu UL UL {
PADDING-RIGHT: 1em; DISPLAY: none; PADDING-LEFT: 1em; Z-INDEX: 500; LEFT: 0%; PADDING-BOTTOM: 1em; MARGIN: -1em 0px 0px -1em; PADDING-TOP: 1em; POSITION: absolute; TOP: auto;
}
#menu UL UL UL {
LEFT: 100%; TOP: 0px;
}
DIV#menu LI:hover {
Z-INDEX: 100; CURSOR: pointer;
}
div#menu li:hover ul ul,
div#menu li li:hover ul ul,
div#menu li li li:hover ul ul,
div#menu li li li li:hover ul ul,
div#menu li li li li li:hover ul ul,
div#menu li li li li li li:hover ul ul,
div#menu li li li li li li li:hover ul ul,
div#menu li li li li li li li li:hover ul ul,
div#menu li li li li li li li li li:hover ul ul,
div#menu li li li li li li li li li li:hover ul ul
{display:none;}
div#menu li:hover ul,
div#menu li li:hover ul,
div#menu li li li:hover ul,
div#menu li li li li:hover ul,
div#menu li li li li li:hover ul,
div#menu li li li li li li:hover ul,
div#menu li li li li li li li:hover ul,
div#menu li li li li li li li li:hover ul,
div#menu li li li li li li li li li:hover ul,
div#menu li li li li li li li li li li:hover ul
{display:block;}
-->
</style>
</head>
----------------------------------------
Please help me...
_________________
Dev |
|
