PDA

View Full Version : Drop Down Tabs and IE 7



jumborex
03-31-2008, 08:22 PM
1) Script Title: Drop Down Tabs

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/droptabmenu.htm

3) Describe problem: I've used this script for a restyling I'm carring on in my site: see, for. ex. this working page (http://www.cantodellasfinge.net/junior/junior_rebus/a_lezione_di_rebus/il_rebus_del_pianista/)
The script operates well, but in certain cases I cannot see the white navigation in the top of pages, if I use Internet Explorer 7.
See this for example:
this similar, but not working page (http://www.cantodellasfinge.net/junior/junior_rebus/a_lezione_di_rebus/il_rebus_del_pianista/template.asp)

The pages have a single difference: the first page (working) has DIV used only for spacing defined as follow:

<div class="BoxDummy" style="width:194px;">
<p>&nbsp; </p>
</div>

Where BoxDummy is declared inside a css as follows:

.BoxDummy {
width: 150px;
height: 150px;
float: left;
overflow: auto;
}
The second page (not working with IE) is the same in all elements, except the previous DIV in this form:

<div class="BoxDummy" style="width:194px; height:auto">
<p>&nbsp; </p>
</div>

I must say that the script apprently is working with Firefox, Opera, and Safari.
The question is: why it is not working in these bothering cases, and what can be done to avoid the trouble?

ddadmin
03-31-2008, 09:18 PM
My guess is there is a CSS targeting your A elements on the problem page that overrides that for div.navigation. Inside your .css file, try adding the code in red below:


div.navigation a{
color:#ddd !important;
text-decoration: none;
font-family: arial, sans-serif;
font-size: 1em;
font-style: normal;
line-height: 1.2em;
font-weight: bold;
font-variant: normal;
}

div.navigation a:hover{
color: #ff0 !important;
text-decoration: none;
}
div.navigation a:active{
color: #FF6600 !important;
text-decoration: none
}