glenelkins Posted December 10, 2008 Share Posted December 10, 2008 Hi Here is my CSS and XHTML for a drop down menu. The example is at: http://domain2051105.sites.fasthosts.com/test/ put the mouse over "Services". It works in FF but in IE 7 its not showing the drop down: CSS body, ul, li { margin: 0px; padding: 0px; } #nav { list-style: none; height: 32px; } #nav li { float:left; line-height: 32px; } #nav li a { display: block; text-indent: -3000px; overflow: hidden; } #nav li ul { position: absolute; list-style: none; display: none; width: 300px; } #nav li ul li a { width: 300px; } #nav li:hover ul { display: block; } #nav li:hover ul li a { padding-left: 5px; text-indent: 0px; } #nav0 a {width:71px;background:#3b3d27 url(/i/nav0.gif) no-repeat;} #nav0 a:hover {background:#9883a7 url(/i/nav0.gif) 0 -32px no-repeat;} #nav1 a {width:102px;background:#3b3d27 url(/i/nav1.gif) no-repeat;} #nav1 a:hover {background:#9883a7 url(/i/nav1.gif) 0 -32px no-repeat;} #nav2 a {width:128px;background:#3b3d27 url(/i/nav2.gif) no-repeat;} #nav2 a:hover {background:#9883a7 url(/i/nav2.gif) 0 -32px no-repeat;} #nav3 a {width:119px;background:#3b3d27 url(/i/nav3.gif) no-repeat;} #nav3 a:hover {background:#9883a7 url(/i/nav3.gif) 0 -32px no-repeat;} #nav4 a {width:99px;background:#3b3d27 url(/i/nav4.gif) no-repeat;} #nav4 a:hover {background:#9883a7 url(/i/nav4.gif) 0 -32px no-repeat;} #nav5 a {width:141px;background:#3b3d27 url(/i/nav5.gif) no-repeat;} #nav5 a:hover {background:#9883a7 url(/i/nav5.gif) 0 -32px no-repeat;} #nav1 ul li a { background: #afafd9; color: #05036e; } #nav1 ul li a:hover { background: #b97df2; color: #05036e; } #nav3 ul li a { background: #afafd9; color: #05036e; } #nav3 ul li a:hover { background: #b97df2; color: #05036e; } XHTML <head> <link rel="stylesheet" type="text/css" href="css/main.css" /> </head> <ul id="nav"> <li id="nav0"><a href="/">Home</a></li> <li id="nav1"><a href="/services">Services</a> <ul> <li><a href="#">Gaurd And Chase Vessels</a></li> <li><a href="#">Environmental Research Vessels</a></li> <li><a href="#">Navigation Assessments</a></li> <li><a href="#">Marine Consultancy</a></li> <li><a href="#">Commercial Fisheries Assessment</a></li> <li><a href="#">Finishg Vessel Management</a></li> <li><a href="#">Desktop Studies</a></li> <li><a href="#">Film Support & Media</a></li> </ul> </li> <li id="nav2"><a href="/recruitment">Recruitment</a></li> <li id="nav3"><a href="/our-vessels">Our Vessels</a> <ul> <li><a href="#">Maggie M</a></li> <li><a href="#">Mary Ann</a></li> <li><a href="#">Ocean Dancer</a></li> <li><a href="#">Sorsum Corda</a></li> </ul> </li> <li id="nav4"><a href="/contact">Contact</a></li> <li id="nav5"><a href="/links">Links</a></li> </ul> Link to comment https://forums.phpfreaks.com/topic/136348-css-dropdown-menu/ Share on other sites More sharing options...
departedmind Posted December 10, 2008 Share Posted December 10, 2008 Well, when I copied your code and it worked properly in IE7 (in my pc). Don't know why it is not working in the live site... confused. Link to comment https://forums.phpfreaks.com/topic/136348-css-dropdown-menu/#findComment-711444 Share on other sites More sharing options...
glenelkins Posted December 10, 2008 Author Share Posted December 10, 2008 check it out now. it was a doctype issue works fine now Link to comment https://forums.phpfreaks.com/topic/136348-css-dropdown-menu/#findComment-711684 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.