473,287 Members | 3,253 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,287 software developers and data experts.

Dropdown navigation not working with IE7

22
Can anyone suggest me how to make my drop down menu work in IE7 too.Its working in other browsers.On mouse over the submenus should be displayed.Am attaching my css code hereby.Anyone please check and give a positive reply.

menu
HOme products support.....
| |
submenus
p1 A
p2 B..
p3...
/*================= STYLES FOR THE PRIMARY NAV ==================*/

@media screen, print {
.menuminwidth0 { /* for all browsers (non-IE) that obey min-width */
position:relative;
border:0;
margin:0;
padding:0;
width:100%;
height:27px;/* 36px masthead height + 18px button height + 1px lower border*/
min-width:950px;
}
}

/* suppress our whole menu when not an interactive mode */
@media projection { .menuminwidth0 { d\isplay:none; } }

* html .menuminwidth1 { /* this allows IE5/6 to simulate min-width capability */
position:relative; /* we can simulate a minimum width by creating a large */
float:left; /* border in this first div, then placing our content */
height: 1px; /* into a second nested div (see 2nd nested div next */
border-left:950px; /* CSS box-model borders are a fixed size */
border-left-style:solid;
border-left-color:transparent;
}

* html .menuminwidth2 { /* used to simulate min-width capability for IE5/6 */
position:relative;
margin-left:-950px;
height: 1px;
}


/*========================= TOP OF THE MENU CASCADE =========================*/

.menu {
position:relative; /* establish a menu-relative positioning context */
float:left; /* play nicely with others */
margin:0;
padding:0;
border:0;
height:27px; /* the menu's overall height */
width:100%; /* we always want our menu to fill the available space */
background-image:url(../images/midnav.gif);
background-repeat: no-repeat;
background-position:center;
}

.menu img {
vertical-align: top; /* prevent images from being pushed down by text */
}

.menu ul {
padding:0;
margin:0;
border:0;
list-style-type:none; /* we don't want to view the list as a list */
line-height:1.5em; /* globally set the menu's item spacing. note */
} /* this must be 1.0 or 1.5 or 2.0 for Mozilla */

.menu li {
float:left; /* this creates the side-by-side array of top-level buttons */
position:relative; /* create local positioning contexts for each button */
margin:0;
}

.menu ul li table {
margin:-1px 0; /* IE5 needs -1px top and bottom table margins */
m\argin:0; /* re-zero the table margins for everyone but IE5 */
border-collapse:collapse; /* IE5 needs this for the sub-menus to work */
font-size:12px; /* this sets the base font size for our entire menu */
}

.drop {
display:block;
padding:0px 0.33em; /* this sets the l/r margins for our menu item */
margin:0;
text-align:right; /* this right alignment goes with the float:left below */
cursor:pointer; /* IE tries to switch back to an I-beam, don't let it */
cursor:hand; /* IE5 only knows about "hand", so set it both ways */
}

.drop span { /* this simultaneously left and right aligns the text and */
float:left; /* the >> in the drop-down menus which link to sub-menus */
}

.rightmenu {
position:relative; /* establish a local positioning context for YAH label */
float:right; /* and right-align it at the top of our page */
}

.leftmenu {
position:relative;
float:right;
font-size:100%;
}

/*======================== TOP LEVEL MENU DEFINITIONS ========================*/

.menu ul li ul {
display:none; /* initially hide the entire list hierarchy */
padding:1px; /* this is our box border width */
}

.menu ul li a,
.menu ul li a:visited { /* unselected top-level menu items */
display:block;
float:left;
text-decoration:none;
height:27px; /*Original Value 18px*/
padding:3px 0px 0 0px;


}

.menu ul li:hover a,
.menu ul li a:hover { /* selected top-level menu items */
/*border-top:1px solid #000;*/ /* these 2 lines create the push-in illusion */
height:25px;/*Original Value 16px*/
padding:4px 0px 0 0px;
}

/*======================== 2ND LEVEL MENU DEFINITIONS ========================*/

.menu ul li:hover ul,
.menu ul li a:hover ul { /* 2nd level drop-down box */
display:block;
position:absolute;
margin:0;
top:20px; /* place us just up underneath the top-level images */
left:-1px; /* left-align our drop-down to the previous button border */
height:auto; /* the drop-down height will be determiend by line count */
width:14.5em;
color:black; /* this sets the unselected-text color */
background:black; /* this sets our menu's effective "border" color */


}

.menu ul li:hover ul.leftbutton,
.menu ul li a:hover ul.leftbutton {/* our first dropdown should not be skewed */
left:0px;
}

.menu ul li:hover ul.skinny,
.menu ul li a:hover ul.skinny { /* 2nd level skinny drop-down box */
width:8.08333em; /* with a 12px default font, this is 97px width (97/12) */
}

.menu ul.rightmenu li:hover ul,
.menu ul.rightmenu li a:hover ul { /* 2nd level neighborhood drop-down box */
right:auto;
left:0; /* nudge the right menu right to line up under the border */
}

* html .menu ul.rightmenu li a:hover ul { /* IE5/6 needs a tweak here */
right:-1px;
}

.menu ul.leftmenu li:hover ul,
.menu ul.leftmenu li a:hover ul { /* 2nd level neighborhood drop-down box */
left:auto;
right:0; /* nudge the right menu right to line up under the border */
}

* html .menu ul.leftmenu li a:hover ul { /* IE5/6 needs a tweak here */
right:-1px;
}

.menu ul li:hover ul li a,
.menu ul li a:hover ul li a { /* 2nd level unselected items */
border:0;
margin:0;
padding:0;
height:auto;
color:#7a1600; /* this sets the unselected drop-down text color */
background:#d8d8d8; /* this sets the drop-down menu background color */
width:14.5em;
text-indent:10px;
}

.menu ul li:hover ul li:hover a,
.menu ul li a:hover ul li a:hover { /* 2nd level selected item */
color:black;
background:white;
}

.menu ul li:hover ul.skinny li a,
.menu ul li a:hover ul.skinny li a,
.menu ul li:hover ul.skinny li a:hover,
.menu ul li a:hover ul.skinny li a:hover { /* 2nd level un+selected items */
width:8.08333em;
}

/*======================== 3RD LEVEL MENU DEFINITIONS ========================*/

.menu ul li:hover ul li ul,
.menu ul li a:hover ul li a ul { /* hide inactive 3rd-level menus */
visibility:hidden;
}

.menu ul li:hover ul li:hover ul,
.menu ul li a:hover ul li a:hover ul { /* 3rd level drop-down box */
visibility:visible;
position:absolute;
margin-top:-1px; /* bring the top edge of the 3rd level menu up one */
top:0;
left:8.08333em;
width:14em;

}

.menu ul li:hover ul li:hover ul li a,
.menu ul li a:hover ul li a:hover ul li a { /* 3rd level unselected items */
width:14em;
background:#d8d8d8;
}

.menu ul li:hover ul li:hover ul li a:hover,
.menu ul li a:hover ul li a:hover ul li a:hover { /* level3 selected items */
width:14em;
background:white;
}

#text { /* the Mac's standard Safari browser will not see this code */
height:1.215em;# /* ... but every other browser will and should */
} /* Safari barfs on the illegal pound sign (#) after the rule's property val */
Jan 2 '07 #1
6 16198
ronverdonk
4,258 Expert 4TB
This thread belongs in the HTML/CSS forum. Will be re-routed.

Ronald :cool:
Jan 2 '07 #2
AricC
1,892 Expert 1GB
Please post a link to that page so we can test.
Jan 4 '07 #3
drhowarddrfine
7,435 Expert 4TB
Yes. Showing the CSS only is only showing half the problem.
Jan 4 '07 #4
Have you managed to fix this?
I got the same problem. Works great in FFox and Opera, ok in IE6 (if you move your mouse fast enough between the menu and the submenu) but in IE7, the submenu just disappear as soon you move your mouse over to it.

Here is a sample page that show the problem. The css is pasted for menu.css and menu_ie.css is pasted in the bottom. The source..well, you know how to get that.

I did create another menu, that help for IE's stupidity, but this one use a Javascript for that. Reall ywould like to have a cross browser, css only drop down menu.

Oh, btw....new here, be nice
Apr 20 '07 #5
nishac
22
Hi
Ya problem was solved.
Here are some sample css statements.Hope it will help you.

*html ul.menu ul {
width:100px; padding-left:0;
position: absolute; display:none;
}
*html ul.menu ul.submenu {
width:100px; padding-left:0; margin-left: 0; float:none;
position: absolute; display:none;
}

Thanks


Have you managed to fix this?
I got the same problem. Works great in FFox and Opera, ok in IE6 (if you move your mouse fast enough between the menu and the submenu) but in IE7, the submenu just disappear as soon you move your mouse over to it.

Here is a sample page that show the problem. The css is pasted for menu.css and menu_ie.css is pasted in the bottom. The source..well, you know how to get that.

I did create another menu, that help for IE's stupidity, but this one use a Javascript for that. Reall ywould like to have a cross browser, css only drop down menu.

Oh, btw....new here, be nice
Apr 20 '07 #6
drhowarddrfine
7,435 Expert 4TB
Your doctype is incorrect. See the stickies at the top of this board. Use html 4.01 strict. You are in quirks mode right now.

You also have one html error of a missing closing p tag.
Apr 20 '07 #7

Sign in to post your reply or Sign up for a free account.

Similar topics

0
by: Veli-Pekka Tätilä | last post by:
Hi, My first post here. I've found some serious accessibility flaws in the Python 2.4 docs and wish they could be rectified over time. I'm very new to Python and initially contacted docs at python...
1
by: Mad Scientist Jr | last post by:
I don't know how this is happening, but a dropdown control I have is resetting to the 2nd value on the list anytime a postback occurs. I have no initiation code outside of If Not (IsPostBack) ...
1
by: Ed Chiu | last post by:
Hi, I have 2 dropdown lists on an ASP.Net page, the first is a list of states of US, the second is City list. When user selects a state, the web page does a postback, create a DB connection and...
2
by: AlanM | last post by:
Hi, Do I remember right that combobox is build using editfield and dropdownlist? If so, how can I get reference to ComboBox's editfield and DropDown? I remember that in the 90's in MFC...
1
by: gary | last post by:
In our site we are encountering problems with drop down boxes. We have a dropdown box & the ONChange event of which is fetching some data from a servlet. However when we use history back button ,...
3
by: =?Utf-8?B?bGpsZXZlbmQy?= | last post by:
I need to show a custom control in the DropDown of a Windows.Forms.ToolStripMenuItem (e.g., similar to the Font Color menu item in Word except that the control is specific to my application). I...
7
by: Brita | last post by:
I have dropdown navigation drawing from a database. There is a dropdown box for all the states we have. When you choose a stat, the counties in the next dropdown box are created. My problem is...
5
by: tceramesh | last post by:
Hi, I am using auto suggest drop down menu..by using div tags and css.. below that i have navigation bar by using list items.. when i search in auto suggest the results are display behind the...
5
by: =?Utf-8?B?Y2hlY2tyYWlzZXJAY29tbXVuaXR5Lm5vc3BhbQ== | last post by:
I have a VS 2008 ASP.NET webform that has a reportview tag on it, accessing an .RLDC report in local report. The columns for the report are essentially: Month Item #1 Item#2 Item#3 ...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
0
by: MeoLessi9 | last post by:
I have VirtualBox installed on Windows 11 and now I would like to install Kali on a virtual machine. However, on the official website, I see two options: "Installer images" and "Virtual machines"....
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
by: marcoviolo | last post by:
Dear all, I would like to implement on my worksheet an vlookup dynamic , that consider a change of pivot excel via win32com, from an external excel (without open it) and save the new file into a...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.