Log in

View Full Version : need help with a gap within a div that toggles visible/hidden


catwoman2970
06-16-2008, 01:41 AM
So in IE6, I have a div set to a height, overflow of auto and inside it is a UL. At first the div is set to visibility: hidden then when you hit the Select a Property button, it toggles to visible. I'm trying to achieve a scrollable div b/c the UL is long. The problem is in IE6 only; when you scroll to the bottom of the div, there is extra space below the UL but within the div (which has an id of qfSelectPrFrame). Any ideas? Note that I'm using a Yahoo Developer code for the toggling, so I can't easily use display:none/block instead of visibility. And if you look at the css directly, you'll see the IE6 hacks at line 784, just an fyi. Here's the code -

<!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=UTF-8" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="http://www.freewebs.com/greenwoodmenus/cssIETest.css" media="screen" />



<script type="text/javascript" src="http://yui.yahooapis.com/2.5.1/build/utilities/utilities.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.5.1/build/container/container-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.5.1/build/menu/menu-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/cookie/cookie-beta-min.js"></script>
<script>var Dom = YAHOO.util.Dom, Event = YAHOO.util.Event, Connect = YAHOO.util.Connect; YAHOO.namespace("extension");</script>

</head>

<body>

<!--QUICK FIND-->
<div class="utilityBox" id="quickFind">
<h2><a href="javascript:toggleDisclosure('qfFrame')" class="disclosureLink"><span class="downArrowOpen" id="qfFrameArrow">Quick Find</span></a></h2>
<div class="spacing11" id="qfFrame">


<script type="text/javascript">

YAHOO.util.Event.onContentReady("qfSelectPrFrame", function () {

var oMenu = new YAHOO.widget.Menu("qfSelectPrFrame", { fixedcenter: false });

oMenu.render();

oMenu.subscribe("show", oMenu.focus);

YAHOO.util.Event.addListener("menutoggle1", "click", oMenu.show, null, oMenu);

});

YAHOO.util.Event.onContentReady("qfSelectPrFrame2", function () {

var oMenu = new YAHOO.widget.Menu("qfSelectPrFrame2", { fixedcenter: false });

oMenu.render();

oMenu.subscribe("show", oMenu.focus);

YAHOO.util.Event.addListener("menutoggle2", "click", oMenu.show, null, oMenu);

});

</script>

<div class="position3" id="sPropMenu">

<button id="menutoggle1" type="button" class="selectDft">Select a Property</button>

<div id="qfSelectPrFrame" class="yuimenu">
<div class="bd">
<ul class="first-of-type">

<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=12930166">TV</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=965750001">Tech</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=8839603">Telemundo</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=2719481">Travel</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=792700001">Video</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=14124354">Weather</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=97092016">Widgets</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=200712111">YSM - Overviews</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=45213">Yahoo! 101</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=8885583">Yellow Pages</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=200712111">YSM - Overviews</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=45213">Yahoo! 101</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=8885583">Yellow Pages</a></li>

</ul>
</div><!--bd-->
</div> <!--qfSelectPrFrame-->


</div><!--position3-->



<p class="font9">OR</p>



<div class="position3" id="sProdServ">

<button id="menutoggle2" type="button" class="selectDft">Select a Product or Service</button>



<div id="qfSelectPrFrame2" class="yuimenu">

<div class="bd">

<ul class="first-of-type" id="selectPr2"><li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=654321">AdInterax</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=7">Campaign Analysis</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=1256465">Case Studies</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=200712118">Category</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=3423423423">Creative</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=342908">Gateway Program</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=5">Promotions</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=1">Research</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=57645">Smart Ads</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=3">Targeting</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=1212948">Training and Enrichment</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=200712115">YSM - Content Match</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=200712117">YSM - Diamond</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=200712111">YSM - Overviews</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=200712114">YSM - Product Submit</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=200712112">YSM - Research</a></li>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://studio.corp.scd.yahoo.com/source_dev/solutions/search/?quick_find_property=quick_find_property&quickfind=200712113">YSM - Search Submit</a></li>
</ul>

</div><!--bd-->

</div><!--qfSelectPrFrame2-->

</div><!--position3-->

</div><!--spacing11-->
</div><!--quickFind-->

</body>
</html>

=========

thanks a bunch!
Sue