Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > IE hiding drop down submenus

Reply
Thread Tools

IE hiding drop down submenus

 
 
Shelly
Guest
Posts: n/a
 
      11-06-2007
In IE (7) the drop down submenus are hiding behind the element below it.
They work fine in Firefox and Opera. I researched this issue on the web and
found suggestions to state position and z-index in the css file. I already
had position: relavive and a z-index set as high as 500. I changed to
position: absolute, but that didn't help.

Here are the important parts of the css file and style in the hope that
someone can see something. The submenu is class item2 and the next element
is item-03. I've include snippets of code, css and in-line style.

menu code snippet:
==============
<td>
<a class="item1" href="javascript:void(0);">Top-level Item</a>
<div class="section">
<a class="item2" href="#"> Sub-level Item 1</a>

<a class="item2" href="#"> Sub-level Item 2</a>
</div>
</td>

inline snippet:
==========
#index-03 {
position:absolute;
left:0px;
top:134px;
width:750px;
height:436px;
background-image: url(images/index_03.gif);
border-right: 2px solid #7C6736;
z-index:100
}



css snippet:
========
..ddmx .item2,
..ddmx .item2:hover,
..ddmx .item2-active,
..ddmx .item2-active:hover {
padding: 3px 0px 4px 0px;
color: #FFFFFF;
text-decoration: none;
text-indent:5px;
width:179px;
display: block;
white-space: nowrap;
position: relative;
z-index: 500;
}

..ddmx .item2 {
background: #A7A4C1;
}

..ddmx .item2:hover,
..ddmx .item2-active,
..ddmx .item2-active:hover {
background: #414162;
}

..ddmx .arrow,
..ddmx .arrow:hover {
padding: 3px 16px 4px 8px;
}

..ddmx .item2 img,
..ddmx .item2-active img{
position: absolute;
top: 4px;
right: 1px;
border: 0;
}

..ddmx .section {
border: 1px solid #A7A4C1;
position: absolute;
visibility: hidden;
z-index: -1;
}

* html .ddmx td { position: relative; } /* ie 5.0 fix */






 
Reply With Quote
 
 
 
 
Bone Ur
Guest
Posts: n/a
 
      11-06-2007
Well bust mah britches and call me cheeky, on Tue, 06 Nov 2007 13:44:51
GMT Shelly scribed:

> In IE (7) the drop down submenus are hiding behind the element below
> it. They work fine in Firefox and Opera. I researched this issue on
> the web and found suggestions to state position and z-index in the css
> file. I already had position: relavive and a z-index set as high as
> 500. I changed to position: absolute, but that didn't help.
>
> Here are the important parts of the css file and style in the hope
> that someone can see something.


I see that you didn't post a url but instead posted these useless snippets
which I shall forebearingly snip in the interests of posterity.

> snip


--
Bone Ur
Cavemen have formidable pheromones.
 
Reply With Quote
 
 
 
 
Shelly
Guest
Posts: n/a
 
      11-06-2007
Bone Ur wrote:
> Well bust mah britches and call me cheeky, on Tue, 06 Nov 2007
> 13:44:51 GMT Shelly scribed:
>
>> In IE (7) the drop down submenus are hiding behind the element below
>> it. They work fine in Firefox and Opera. I researched this issue on
>> the web and found suggestions to state position and z-index in the
>> css file. I already had position: relavive and a z-index set as
>> high as 500. I changed to position: absolute, but that didn't help.
>>
>> Here are the important parts of the css file and style in the hope
>> that someone can see something.

>
> I see that you didn't post a url but instead posted these useless
> snippets which I shall forebearingly snip in the interests of
> posterity.


OK, Cheeky, I have participated in news groups before and given plenty of
help to people in the past so I am no newcomer to this type of thing. The
protocol in the various newsgroups has always been to eliminate a direct
reference to a particular site in the interest of protecting the client.
That is why I didn't post the URL. Maybe it is different in THIS newsgroup,
but I would be surprised if it is.

That said, I posted the other than "useless" snippets. They pertain
directly to the suggestions for a fix that I found on the net. I posted
them because they already include those suggestions (high z-order, including
a position attribute). I had hoped that someone with some other than snide
complaining might be able to see something or suggest something. Meanwhile,
you needn't "bust mah britches".

If it is absolutely necessary to post a URL, I will go through the tedious
labor of porting the stuff to a different site, blacking out client content,
and then posting that URL.

Shelly


 
Reply With Quote
 
Shelly
Guest
Posts: n/a
 
      11-06-2007
Shelly wrote:
> Bone Ur wrote:
>> Well bust mah britches and call me cheeky, on Tue, 06 Nov 2007
>> 13:44:51 GMT Shelly scribed:
>>
>>> In IE (7) the drop down submenus are hiding behind the element below
>>> it. They work fine in Firefox and Opera. I researched this issue on
>>> the web and found suggestions to state position and z-index in the
>>> css file. I already had position: relavive and a z-index set as
>>> high as 500. I changed to position: absolute, but that didn't help.
>>>
>>> Here are the important parts of the css file and style in the hope
>>> that someone can see something.

>>
>> I see that you didn't post a url but instead posted these useless
>> snippets which I shall forebearingly snip in the interests of
>> posterity.


OK, I have proted it. The URL to look at is www.sheldonlg.com/test.html

In Internet explorer, the drop down falls behind the text whereas in Firefox
amd Opera it covers the text.

Shelly


 
Reply With Quote
 
upwebadmin
Guest
Posts: n/a
 
      11-06-2007
I don't see the problem with what you have but all my menu navigation
needs are typically solved by Dynamic Drive.
http://www.dynamicdrive.com/dynamicindex1/indexb.html

Good luck

--
Dan
http://www.universepoint.com

 
Reply With Quote
 
Shelly
Guest
Posts: n/a
 
      11-06-2007
upwebadmin wrote:
> I don't see the problem with what you have but all my menu navigation
> needs are typically solved by Dynamic Drive.
> http://www.dynamicdrive.com/dynamicindex1/indexb.html
>
> Good luck


If you click on "Services" the drop down menu falls behind "Test that is for
testing". In Firefox and Opera it covers that text. I am using IE 7.0.

When there is more text, it will completely hide the drop down menu. Again,
the url is www.sheldonlg.com/test.html


 
Reply With Quote
 
Beauregard T. Shagnasty
Guest
Posts: n/a
 
      11-06-2007
Shelly wrote:

> OK, I have proted it. The URL to look at is
> www.sheldonlg.com/test.html


Dropdown? Oh wait. JavaScript must be available. There goes ~10% of
your visitors, plus the Googlebot, who won't be able to navigate your
site. Are you sure you want that? It's like turning off your web server
for a month every year.

> In Internet explorer, the drop down falls behind the text whereas in
> Firefox amd Opera it covers the text.


You should add a proper DOCTYPE to take IE out of Quirks Mode first,
then see what it does.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

Remove those HTML comment markers from your styles.
No need for that Netscape 4 DreamWeaver script to reload the page. NN 4
is used so seldom these days as to warrant not even considering it.

There are other errors.
<http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.sheldonlg.com %2Ftest.html>
<http://jigsaw.w3.org/css-validator/validator?profile=css2&warning=2&uri=http%3A%2F%2F www.sheldonlg.com%2Ftest.html>

You say: .ddmx { font: 12px tahoma; ...
Read this, please: http://k75s.home.att.net/fontsize.html

--
-bts
-Motorcycles defy gravity; cars just suck
 
Reply With Quote
 
Shelly
Guest
Posts: n/a
 
      11-06-2007
Beauregard T. Shagnasty wrote:
> Shelly wrote:
>
>> OK, I have proted it. The URL to look at is
>> www.sheldonlg.com/test.html

>
> Dropdown? Oh wait. JavaScript must be available. There goes ~10% of
> your visitors, plus the Googlebot, who won't be able to navigate your
> site. Are you sure you want that? It's like turning off your web
> server for a month every year.


This is a customer requirement. 'Nuff said. Do you know of another way to
have dropdown menus WITHOUT Javascript? I'm open to suggestions, but
dropdowns are a must.

>
>> In Internet explorer, the drop down falls behind the text whereas in
>> Firefox amd Opera it covers the text.

>
> You should add a proper DOCTYPE to take IE out of Quirks Mode first,
> then see what it does.
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
> "http://www.w3.org/TR/html4/strict.dtd">


I'll do this.

>
> Remove those HTML comment markers from your styles.
> No need for that Netscape 4 DreamWeaver script to reload the page. NN
> 4 is used so seldom these days as to warrant not even considering it.


OK.

>
> There are other errors.
> <http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.sheldonlg.com %2Ftest.html>
> <http://jigsaw.w3.org/css-validator/validator?profile=css2&warning=2&uri=http%3A%2F%2F www.sheldonlg.com%2Ftest.html>
>
> You say: .ddmx { font: 12px tahoma; ...
> Read this, please: http://k75s.home.att.net/fontsize.html


Thanks. I'll report back.


 
Reply With Quote
 
Shelly
Guest
Posts: n/a
 
      11-06-2007
Beauregard T. Shagnasty wrote:
> Shelly wrote:
>
>> OK, I have proted it. The URL to look at is
>> www.sheldonlg.com/test.html

>
> Dropdown? Oh wait. JavaScript must be available. There goes ~10% of
> your visitors, plus the Googlebot, who won't be able to navigate your
> site. Are you sure you want that? It's like turning off your web
> server for a month every year.
>
>> In Internet explorer, the drop down falls behind the text whereas in
>> Firefox amd Opera it covers the text.

>
> You should add a proper DOCTYPE to take IE out of Quirks Mode first,
> then see what it does.
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
> "http://www.w3.org/TR/html4/strict.dtd">
>
> Remove those HTML comment markers from your styles.
> No need for that Netscape 4 DreamWeaver script to reload the page. NN
> 4 is used so seldom these days as to warrant not even considering it.
>
> There are other errors.
> <http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.sheldonlg.com %2Ftest.html>
> <http://jigsaw.w3.org/css-validator/validator?profile=css2&warning=2&uri=http%3A%2F%2F www.sheldonlg.com%2Ftest.html>
>
> You say: .ddmx { font: 12px tahoma; ...
> Read this, please: http://k75s.home.att.net/fontsize.html


I fixed all those errors and it still has the problem
(www.sheldonlg.com/test.html)/ As for fixed pixel size, I agree, but that
is not what I am trying to fix here first.

Shelly


 
Reply With Quote
 
Beauregard T. Shagnasty
Guest
Posts: n/a
 
      11-06-2007
Shelly wrote:

> This is a customer requirement. 'Nuff said. Do you know of another way to
> have dropdown menus WITHOUT Javascript? I'm open to suggestions, but
> dropdowns are a must.


A must? Oh pshaw. I think they are quite annoying, as they flash about
as I move the mouse from, say, scrollbar to Back button. I guess your
customer is more interested in the glitz.

A few seconds at Google turns up these, and there are lots more:

http://www.alistapart.com/articles/horizdropdowns
http://www.cssplay.co.uk/menus/final_drop.html
http://meyerweb.com/eric/css/edge/menus/demo.html
http://www.seoconsultants.com/css/menus/tutorial/
http://www.opencube.com/

Now, I have not tried any of these, because I have always been able to
talk my clients out of using them. Usually by taking them to a site like
http://mlb.com or
http://www.accuweather.com/
and waving the mouse around a bit.

They are also very difficult to use for anyone with motor deficiencies,
or blind users, or people with text-only browsers, etc etc. Hopefully,
no visitors who operate their computers by using a pencil in their mouth
will visit your site. :-/

--
-bts
-Motorcycles defy gravity; cars just suck
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Affecting a dynamically created drop down from another dynamically created drop down. msimmons ASP .Net 0 07-16-2009 03:17 PM
retrive preselected value in second drop down list from the first drop down list weiwei ASP .Net 0 01-05-2007 07:29 PM
Multiple select drop down poplulating sub drop down scott@dettcom.com Javascript 3 11-09-2006 07:50 PM
Auto Drop down a Drop Down List xxbmichae1@supergambler.com Javascript 5 11-23-2005 01:35 AM
New to .NET, can I have one drop down box control the data of another drop down box using a database? SirPoonga ASP .Net 2 01-07-2005 10:44 PM



Advertisments
 



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57