chaskell Posted March 2, 2007 Share Posted March 2, 2007 Can anyone see what's wrong with my CSS on this page? It looks perfect in Firefox, but in IE7 the flyout menus move down a little more as you go down the page. The page is at: http://www.flower-mound.com/redesign/home_video.php The css is at: http://www.flower-mound.com/redesign/vertical.css Thanks in advance. Cyrus cyrus@cyrushaskell.com Quote Link to comment https://forums.phpfreaks.com/topic/40926-css-nav-bug-in-ie-7/ Share on other sites More sharing options...
chaskell Posted March 5, 2007 Author Share Posted March 5, 2007 Here is the code for this page: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>The Town of Flower Mound, Texas</title> <link href="fm_stylesnew.css" rel="stylesheet" type="text/css" /> <style type="text/css"> body { background-image: url(bgrnd_tile.gif); margin-left: 5px; margin-top: 5px; } #Layer1 { position:absolute; left:14px; top:115px; width:175px; height:482px; z-index:1000; overflow: visible; } #Layer2 { position:absolute; left:0px; top:0px; width:200px; height:115px; z-index:2; } #Layer3 { position:absolute; left:199px; top:115px; width:461px; height:230; z-index:3; } #Layer4 { position:absolute; left:0px; top:0px; width:599px; height:134px; z-index:4; } #Layer5 { position:absolute; left:0px; top:0px; width:664px; height:115px; z-index:5; } #Layer6 { position:absolute; left:671px; top:115px; width:250px; height:200px; z-index:6; background-color: #FFFFFF; } </style> <link href="weather.css" rel="stylesheet" type="text/css" /> <style type="text/css"> <!-- #Layer7 { position:absolute; left:670px; top:330px; width:246px; height:318px; z-index:7; overflow: auto; } --> </style> <link href="vertical.css" rel="stylesheet" type="text/css" /> <style type="text/css"> <!-- #Layer8 { position:absolute; left:26px; top:492px; width:150px; height:100; z-index:5000; } #Layer9 { position:absolute; left:18px; top:251px; width:159px; height:224px; z-index:1001; overflow: visible; } #Layer10 { position:absolute; left:11px; top:312px; width:175px; height:120px; z-index:1001; overflow: visible; } #Layer11 { position:absolute; left:17px; top:117px; width:175px; height:62px; z-index:50000; } #Layer12 { position:absolute; left:764px; top:95px; width:163px; height:15px; z-index:1002; } #Layer13 { position:absolute; left:199px; top:356px; width:160px; height:290px; z-index:501; overflow: auto; } #Layer14 { position:absolute; left:375px; top:486px; width:276px; height:122px; z-index:500; overflow: auto; padding-top: 4px; visibility: visible; } #Layer15 { position:absolute; left:375px; top:356px; width:276px; height:122px; z-index:505; overflow: auto; } #Layer16 { position:absolute; left:21px; top:299px; width:158px; height:169px; z-index:50001; } .style5 {color: #333333} #Layer17 { position:absolute; left:375px; top:489px; width:276px; height:157px; z-index:50002; } --> </style> <script type="text/javascript"> <!-- function MM_CheckFlashVersion(reqVerStr,msg){ with(navigator){ var isIE = (appVersion.indexOf("MSIE") != -1 && userAgent.indexOf("Opera") == -1); var isWin = (appVersion.toLowerCase().indexOf("win") != -1); if (!isIE || !isWin){ var flashVer = -1; if (plugins && plugins.length > 0){ var desc = plugins["Shockwave Flash"] ? plugins["Shockwave Flash"].description : ""; desc = plugins["Shockwave Flash 2.0"] ? plugins["Shockwave Flash 2.0"].description : desc; if (desc == "") flashVer = -1; else{ var descArr = desc.split(" "); var tempArrMajor = descArr[2].split("."); var verMajor = tempArrMajor[0]; var tempArrMinor = (descArr[3] != "") ? descArr[3].split("r") : descArr[4].split("r"); var verMinor = (tempArrMinor[1] > 0) ? tempArrMinor[1] : 0; flashVer = parseFloat(verMajor + "." + verMinor); } } // WebTV has Flash Player 4 or lower -- too low for video else if (userAgent.toLowerCase().indexOf("webtv") != -1) flashVer = 4.0; var verArr = reqVerStr.split(","); var reqVer = parseFloat(verArr[0] + "." + verArr[2]); if (flashVer < reqVer){ if (confirm(msg)) window.location = "http://www.macromedia.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash"; } } } } function MM_jumpMenu(targ,selObj,restore){ //v3.0 eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'"); if (restore) selObj.selectedIndex=0; } function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script> <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script> </head> <body onload="MM_CheckFlashVersion('8,0,0,0','Content on this page requires a newer version of Macromedia Flash Player. Do you want to download it now?');"> <div class="frame_nopadding" id="Layer13"> <span class="largeheadercenter">Calendar</span><br /> <table width="143" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="calendar_date">March 1, 2007 </td> </tr> <tr> <td class="calendar_row">Some event </td> </tr> <tr> <td class="calendar_rowalternate">some other event </td> </tr> <tr> <td class="calendar_date">March 2, 2007 </td> </tr> <tr> <td class="calendar_row">some event </td> </tr> <tr> <td class="calendar_rowalternate">some event </td> </tr> <tr> <td class="calendar_row">some event </td> </tr> <tr> <td class="calendar_date">March 3, 2007 </td> </tr> <tr> <td class="calendar_row">some event </td> </tr> <tr> <td class="calendar_rowalternate">some event </td> </tr> <tr> <td class="calendar_row">some event </td> </tr> <tr> <td class="calendar_rowalternate">some event </td> </tr> <tr> <td class="calendar_date">March 4, 2007 </td> </tr> <tr> <td class="calendar_row">some event </td> </tr> <tr> <td class="calendar_rowalternate">some event </td> </tr> <tr> <td class="calendar_row">some event </td> </tr> <tr> <td class="calendar_date">March 5, 2007 </td> </tr> <tr> <td class="calendar_row">some event </td> </tr> <tr> <td class="calendar_rowalternate">some event </td> </tr> <tr> <td class="calendar_row">some event </td> </tr> <tr> <td class="calendar_rowalternate">some event </td> </tr> </table> <br /> </div> <div class="genericframe" id="Layer15"><span class="largeheadercenter">Weather and Traffic <br /> <!--end gather feed information--> <style type="text/css"> <!-- .style5 {color: #333333} --> </style> <table height="76" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="83" height="76" align="center" valign="top" class="weatherleftcolumn"><div align="center"><img src="http://www.weather.gov/weather/images/fcicons/skc.jpg" border="1" align="absmiddle" /> <br /> <span class="weather_stats"><a class="weather_stats">Currently</a></span><a class="weather_data"><br /> </a> </div> <div class="temperature">40° F</div> </td> <td width="238" valign="top" class="weatherbackground"><div class="weathermainstat">Fair</div> <div class="weather_stats"><span class="weather_stats">Wind</span> From the South at 3 mph (190° at 3 knots)</div> <hr /> <a href="http://dfwtraffic.dot.state.tx.us/#map.create(33.045767,-97.176281,10);setTimeout(function(){map.showIncidentIcons(tmcs['DalTrans']);map.showLaneClosureIcons(tmcs['DalTrans']);map.showCameraIcons(tmcs['DalTrans']);map.showDmsIcons(tmcs['DalTrans']);map.showDetectionZones(tmcs['DalTrans']);map.showIncidentIcons(tmcs['TransVISION']);map.showLaneClosureIcons(tmcs['TransVISION']);map.showCameraIcons(tmcs['TransVISION']);map.showDmsIcons(tmcs['TransVISION']);},2000);" target="_blank" class="bodycopyblue">Check your daily commute with DFW Traffic</a></td> </tr> </table> </span><span class="bodycopy"><br /> </span></div> <div id="Layer16"> <form name="tfm_search" method="get" action="search_results.php"> <div align="center"><span class="RSSLink">Search for phone numbers by service </span><br /> </div> <table cellpadding=0 cellspacing=0> <tr> <td><input name="search" type="text" class="depsearch_field" size="25" /> </td></tr><tr><td valign="top"><input name="submit" type="submit" class="btn" value="Search" /> <select name="anyallexact"> <option value="all" selected="selected">All words</option> <option value="any">Any words</option> <option value="exact">Exact phrase</option> </select> </td> </tr> </table> <br /> <span class="subinfo">(e.g. trash, fire, permit, animal) For service requests, concerns or questions, please contact 972.539.SERV or e-mail <a href="mailto:townhall@flower-mound.com">townhall@flower-mound.com</a>. After hours, please call 972.539.0525</span> </form> </div> <div class="genericframe" id="Layer17"><span class="largeheadercenter">About Flower Mound </span><br /> <span class="bodycopy">Rich in history and tradition, the Town of Flower Mound is continually evolving. For more information about Flower Mound, please see the links below.</span> <table width="98%" border="1" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="50%" align="left" valign="middle" class="bodycopyblue"><p><a href="http://www.flower-mound.com/history/history.php" target="_blank" class="bodycopyblue">Flower Mound History</a></p></td> <td width="50%" align="left" valign="middle" class="bodycopyblue"><a href="http://www.flower-mound.com/econdev/demographics.html" target="_blank" class="bodycopyblue">Demographics</a></td> </tr> <tr> <td width="50%" align="left" valign="middle" class="bodycopyblue"><a href="http://www.flower-mound.com/econdev/guide.pdf" target="_blank" class="bodycopyblue">Shopping Guide</a></td> <td align="left" valign="middle" class="bodycopyblue"><a href="http://www.flower-mound.com/comm_info/brochure.php" target="_blank" class="bodycopyblue">The Flower Mound</a></td> </tr> <tr> <td width="50%" height="15" align="left" valign="middle" class="bodycopyblue"><a href="http://www.flower-mound.com/econdev/" class="bodycopyblue">Economic Development</a></td> <td align="left" valign="middle" class="bodycopyblue"><a href="http://www.flower-mound.com/gallery/gallery.php" class="bodycopyblue">Image Gallery</a></td> </tr> </table> </div> <script type="text/javascript" src="menu.js"></script> <div class="navcolumn" id="Layer1"> <ul class="vertical" id="menu-v" name="menu-v"> <li><a href="quicklinks.php" name="quick links" title="Quick Links" id="Quick Links">FM Features </a> <ul> <li><a href="http://www.flower-mound.com/parks/acitivity-programs-guide.pdf" title="Activity & Programs Guide">Activity & Programs Guide</a></li> <li><a href="http://www.flower-mound.com/animals/pets.php" title="Adopt A Pet Today">Adopt A Pet Today</a></li> <li><a href="http://www.flower-mound.com/boards/boards.php" title="Boards & Commissions">Boards & Commissions</a></li> <li><a href="http://www.flower-mound.com/charter/index.php" title="Charter Review Commission">Charter Review Commission</a></li> <li><a href="http://www.flower-mound.com/code/code.php" title="Code of Ordinances">Code of Ordinances</a></li> <li><a href="http://cdx.xceligent.com/privatebrandingcode/ListingSearchCriteria.asp?BranchID=22547" title="Commercial Property Search">Commercial Property Search</a></li> <li><a href="http://www.flower-mound.com/cac" title="Community Activity Center">Community Activity Center</a></li> <li><a href="http://www.flower-mound.com/customer/customer_main.php" title="Customer Relations">Customer Relations</a></li> <li><a href="http://www.dentoncountywater.com/" title="Denton County Water">Denton County Water</a></li> <li><a href="http://www.flower-mound.com/1171-Information/" title="FM1171 Information">FM1171 Information</a></li> <li><a href="http://www.flower-mound.com/2499_information/2499.php" title="FM2499 Information">FM2499 Information</a></li> <li><a href="http://www.flower-mound.com/seniors" title="Seniors in Motion">Seniors in Motion</a></li> </ul> </li> <li><a href="for_residents.php" title="Information for residents of the Town of Flower Mound">For Residents</a> <ul> <li><a href="http://www.brothercake.com/site/portfolio/sites/" title="Websites I've built or been involved with recently">Websites</a></li> <li><a href="http://www.brothercake.com/site/portfolio/projects/" title="Other projects I've been involved with recently">Projects</a></li> <li><a href="http://www.brothercake.com/site/portfolio/testimonials/" title="Quotes from clients and collaborators">Testimonials</a></li> </ul> </li> <li><a href="for_businesses.php" title="Information for companies and individuals doing business in the Town of Flower Mound">For Businesses</a> <ul> <li><a href="http://www.brothercake.com/site/products/development/" title="Quality accessible web development, from single-page templates to large dynamic sites">Website development</a></li> <li><a href="http://www.brothercake.com/site/products/programming/" title="Custom javascript and DHTML programming">DHTML programming</a></li> <li><a href="http://www.brothercake.com/site/products/menu/" title="UDM is the world's first fully-featured and accessible website menu">Ultimate Drop Down Menu</a></li> </ul> </li> <li><a href="online_services.php" title="Online services, forms and applications">Online Services</a></li> <li><a href="webhelp" title="Web Help">Web Help</a> <ul> <li><a href="http://www.brothercake.com/site/products/development/" title="Quality accessible web development, from single-page templates to large dynamic sites">Website development</a></li> <li><a href="http://www.brothercake.com/site/products/programming/" title="Custom javascript and DHTML programming">DHTML programming</a></li> <li><a href="http://www.brothercake.com/site/products/menu/" title="UDM is the world's first fully-featured and accessible website menu">Ultimate Drop Down Menu</a></li> </ul> </li> </ul> </ul> <!--Departmental Search--> </div> <div id="Layer2"></div> <div class="highlightsbox_front" id="Layer3"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="174" height="236" rowspan="2" align="left" valign="top" class="photorotator"><img src="rotator/rotator001.jpg" alt="random image" width="174" height="230" class="centerframe" /></td> <td align="center" valign="top" class="bottomrule"><div align="left"><br /> <br /> </div> </td> </tr> <tr> </tr> </table></div> <div class="frame_nopadding" id="Layer6"><a href="http://www.flower-mound.com/cac"></a> <script type="text/javascript"> AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','250','height','200','title','FMTV Live Player','src','video/fmtv_player','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','video/fmtv_player' ); //end AC code </script> <noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="250" height="200" title="FMTV Live Player"> <param name="movie" value="video/fmtv_player.swf" /> <param name="quality" value="high" /> <embed src="video/fmtv_player.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="250" height="200"></embed> </object> </noscript></div> <div class="frame_nopadding" id="Layer7"> <span align="center" class="largeheadercenter">Announcements</span> <div align="center"><a href="http://www.flower-mound.com/news/news.php#appraisalreform" class="announcements">Legislative Update - Texas Task Force on Appraisal Reform </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#ebooks" class="announcements">Library Offers Downloadable eAudiobooks </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#safetygrant" class="announcements">Town Receives Public Safety Grant </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#crackdown" class="announcements">Juvenile Curfew Violation Crackdown </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#revenuecommittee" class="announcements">Town Council Appoints Revenue Options Committee </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#teamup" class="announcements">Town and Chamber Team Up </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <span class="announcements"><a href="http://www.flower-mound.com/news/news.php#cac" class="announcements">Town Launches Community Activity Center Webpage</a><a href="http://www.flower-mound.com/news/news.php#cac"></a></span><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <span class="announcements"><a href="http://www.flower-mound.com/news/news.php#compost" class="announcements">Keep Flower Mound Beautiful offers Master Composter class </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#etown" class="announcements">Sign up for New E-Town Bulletins </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#libraryvirtual" class="announcements">Library Offers Virtual Research Workshops </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#springacademy" class="announcements">FMPD to Offer Spring Citizen Police Academy </a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#suburb" class="announcements">Flower Mound Named Top 25 Suburb</a><br /> <img src="http://www.flower-mound.com/line.gif" alt="divider line" border="0" height="5" hspace="2" vspace="4" width="207" /><br /> <a href="http://www.flower-mound.com/news/news.php#alert" class="announcements">Residents Encouraged to Sign up for Emergency Alert Bulletin</a></span> </div> </div> <div id="Layer8"><img src="images/FMLogo_glow.jpg" alt="Flower Mound Logo" width="150" height="95" /></div> <div id="Layer11"> <div align="center" class="rollover"><span class="RSSLink">E-Government</span><span class="text1"><br /> <select name="select" size="1" class="egov" onchange="MM_jumpMenu('parent',this,0)"> <option selected="selected">Click here to select... </option> <option value="http://www.flower-mound.com/2TurnItOn/index.php">Activate Utilities </option> <option value="http://www.flower-mound.com/town_sec/town_sec_agenda_item_comments.php">Agenda Item Comments </option> <option value="http://www.flower-mound.com/comm_info/request_form.php">Online Public Information Request </option> <option value="http://www.flower-mound.com/courts/juror_exempt.php">Online Juror Exemption Application </option> <option value="http://www.flower-mound.com/parks/park_improve.php">Online Request for Park Improvements </option> <option value="http://www.flower-mound.com/customer/customer_street_lights.php">Online Street Light Repair Request </option> <option value="http://www.flower-mound.com/hr/online_app.php">Online Job Application </option> <option value="http://library.flower-mound.com/How_Lib_Card.htm">Online Library Card Application </option> <option value="http://www.flower-mound.com/police/police_traffic.php">Submit a Traffic Complaint </option> <option value="http://www.flower-mound.com/agenda/agenda.php">View Agendas & Minutes </option> <option value="http://www.flower-mound.com/public/newsletters.php">View Inside FM Newsletter </option> <option value="http://www.flower-mound.com/code/code.php">View Code of Ordinances </option> <option value="http://www.flower-mound.com/bldginsp/bldg_stat.php">View Building Statistical Information </option> <option value="http://www.flower-mound.com/planning/case_log.pdf">View Planning Case Log </option> <option value="http://www.flower-mound.com/customer/Flower Mound Water Report.pdf">View Water Quality Report </option> <option value="http://www.flower-mound.com/form/choose.php">Looking for a Form or a Report?</option> </select> </span></div> </div> <div id="Layer12"> <div align="right"><a href="http://www.flower-mound.com/news.xml"><span class="RSSLink">RSS Feed | </span><img src="xml.gif" alt="RSS Feed" width="36" height="14" border="0" /></a></div> </div> <div class="body_frame" id="body"> <style type="text/css"> <!-- #SearchEngineLayer { position:absolute; left:561px; top:36px; width:248px; height:73px; z-index:1; overflow: visible; } --> </style> <div id="SearchEngineLayer"><!--begin search form--> <form method="get" action="http://www.flower-mound.com/cgi-bin/perlfect/search/search.pl"> <div align="center"> <p> <input type="hidden" name="p" value="1" /> <input type="hidden" name="lang" value="en" /> <input type="hidden" name="include" value="" /> <input type="hidden" name="exclude" value="" /> <input type="hidden" name="penalty" value="0" /> <input type="hidden" name="mode"> <input name="hidden" type="hidden" value="all" /> <input name="hidden" type="hidden" value="any" /> <span class="elementhead">Search Flower-Mound.com</span><br /> <input name="q" type="text" class="text1" size="25" /> <input name="Submit" type="submit" class="btn" value="Search" /> <input name="hidden" type="hidden" value="Search" /> </p> </div> </form> <!--end search form--></div> <img src="fm_header.jpg" alt="Flower Mound Header" width="925" height="108" /> <div class="guts"> </div> <div class="footer"> <div align="center"> <p><a href="javascript:void(0)" class="white_navbar_text" onclick="MM_openBrWindow('disclaimer.html','disclaimer','width=400,height=300')">Site Disclaimer & Recommendations</a></p> </div> </div> </div> </body> </html> Here is the CSS: /* tame the lists */ ul.vertical, ul.vertical li { margin:0; padding:0; list-style-type:none; font-size:100%; /* fix for win/ie's "non-linear text scaling" bug */ } /* navbar list */ ul.vertical { position:absolute; cursor:default; /* navbar width */ width:175px; /* navbar left and top position this DOES NOT already include 1px compensation on TOP, for list-item border collapse (1px defaults to around 0.05em) */ left:1px; top:75px; } /* navbar list-items */ ul.vertical li { position:relative; text-align:left; cursor:pointer; cursor:hand; /* duplicate navbar width */ width:175px; /* shift list-items to collapse borders vertically */ margin:-1px 0 0 0; } /* menu lists */ ul.vertical ul { cursor:default; position:absolute; /* menu width */ width:175px; /* menu offset, which already includes 1px compensation on TOP, for list-item border collapse */ margin:0px 0 0 173px; /* overlapping the menus improves usability */ /* position menus off the screen to hide because using display, visibility, overflow or clip, would hide them from browser-based screenreaders as well */ top:-100em; /* shift menus to collapse navbar->menu borders */ left:-1px; /* compensate for list-item border collapse */ padding:1px 0 0 0; } /* menu list-items */ ul.vertical ul li { /* duplicate menu width */ width:175 px; } /* further child-menu offset */ ul.vertical ul ul { /* this already includes 1px compensation for list-item border collapse */ margin:0 0 0 173px; /* overlapping the menus improves usability */ } /* menu triggers -- position menus back on the screen to show hide these from safari < 1.2 because of it's "sticky hover" bug that would make it difficult or impossible to close the menus we're hiding it using the "@media with Media Type in Mixed Case" hack http://www.dithered.com/css_filters/css_only/media_mixed_case.html */ @media Screen, Projection { ul.vertical li:hover > ul { top:0; } } /* links */ ul.vertical a, ul.vertical a:visited { display:block; cursor:pointer; cursor:hand; color:#120B3F; text-decoration:none; letter-spacing:1px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; font-weight: 900; font-variant: normal; background-color: #340065; width: 151px; padding-top: 2px; padding-right: 7px; padding-bottom: 2px; padding-left: 7px; background-image: url(images/button_bground.jpg); background-repeat: repeat-x; height: auto; vertical-align: middle; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 8px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: #140D41; border-right-color: #140D41; border-bottom-color: #140D41; border-left-color: #140D41; } /* rollover pseudo-classes, and scriptable persistence class */ ul.vertical a:hover, ul.vertical a:focus, ul.vertical a.rollover, ul.vertical a.rollover:visited { color:#FFFFFF; background-color: #160F43; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 8px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: #CCCCCC; border-right-color: #CCCCCC; border-bottom-color: #CCCCCC; border-left-color: #CCCCCC; background-image: none; } /* hacks for win/ie to cure 'excess hidden margins' bug */ @media screen, projection { * html ul.vertical li { /* for ie5.0 */ display:inline; /* for ie5.5+ */ f\loat:left; /* this cures 'events fall through the menu' bug in ie6 */ background:#ffffff; } } /* use different comparative positioning for ie, to avoid problems with virtual z-ordering */ * html ul.vertical li { position:static; } * html ul.vertical a { position:relative; z-index:120000; } /* hide menus from konqueror < 3.2 */ ul[class^="vertical"] ul { display:none; } ul[class^="vertical"] ul { displa\y:block; } Quote Link to comment https://forums.phpfreaks.com/topic/40926-css-nav-bug-in-ie-7/#findComment-200012 Share on other sites More sharing options...
michaellunsford Posted March 12, 2007 Share Posted March 12, 2007 I'm working on a similar problem. Hopefully will have a solution before weeks end. But if someone has the answer, it would certainly save hours of hacking on IE7. Thanks! Quote Link to comment https://forums.phpfreaks.com/topic/40926-css-nav-bug-in-ie-7/#findComment-205833 Share on other sites More sharing options...
michaellunsford Posted March 18, 2007 Share Posted March 18, 2007 did you get this figured out? the page is no longer there. Quote Link to comment https://forums.phpfreaks.com/topic/40926-css-nav-bug-in-ie-7/#findComment-209949 Share on other sites More sharing options...
chaskell Posted March 21, 2007 Author Share Posted March 21, 2007 I still didn't get it figured out. I'm trying to eliminate the need for the flyout menu because I can't find one that's reliably cross-browser. Quote Link to comment https://forums.phpfreaks.com/topic/40926-css-nav-bug-in-ie-7/#findComment-211934 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.