473,326 Members | 2,438 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,326 software developers and data experts.

IE6 with css and html worries

Hi there,

I am having some very strange behavior with ie6 and the code i have partly written and partly gotten pub license.

I created some menues, using csshover...the menues look ok and work fine in ie7 and firefox...
i have two divs there right next to each other...the right one with hovering menues and so on...
in ie6 the two divs appear on top of each other and when i hover over the menue the submenu doesn't appear...

Unfortunately this is supposed to go out in about an hour so I am in urgent and desperate need of help...
I've been working on this for about 40 hours since Sunday...

Can anyone help? I can email you the html and css code...

or paste it in here...

Thanks,

Olli
May 16 '07 #1
4 1825
and here is some markup.

html:

<!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>xcx</title>
<style type="text/css">
<!--
body {
background-color: #333333;
}
.style1 {
font-family: "Times New Roman", Times, serif;
font-size: 24px;
color: #FFFFFF;
}
.style5 {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
color: #FFFFFF;
}
-->
</style>
<!-- You will need these next two external files. -->
<!--[if IE]>
<style type="text/css">
body {word-wrap: break-word;}
</style>
<![endif]-->
<!--[if IE]><style type="text/css" media="screen">body{behavior:url(/css/csshover.htc);}</style><![endif]-->

<style type="text/css">
@import url("css/menu.css");
</style>

</head>

<body>

<div align="center">
</div>
<div align="center"><img src="images/image001.jpg" alt="office image 1" name="Chicago" width="80" height="80" hspace="10" vspace="10" id="Chicago" />
<img src="images/image002.jpg" alt="office image 2" name="London" width="80" height="80" hspace="10" vspace="10" id="London" />
<img src="images/image003.jpg" alt="office image 3" name="LA" width="80" height="80" hspace="10" vspace="10" id="LA" />
<img src="images/image004.jpg" alt="office image 4" name="Munich" width="80" height="80" hspace="10" vspace="10" id="Munich" />
<img src="images/image005.jpg" alt="office image 5" name="NY" width="80" height="80" hspace="10" vspace="10" id="NY" />
<img src="images/image006.jpg" alt="office image 6" name="SF" width="80" height="80" hspace="10" vspace="10" id="SF" />
<img src="images/image007.jpg" alt="office image 7" name="Washington" width="80" height="80" hspace="10" vspace="10" id="Washington" />
<img src="images/image008.jpg" alt="office image 8" name="HK" width="80" height="80" hspace="10" vspace="10" id="HK" /></div>
<p align="center" class="style5">&nbsp;</p>

<div id="menu">
<ul>
<div id="left">I.</div>
<li><a href="I.html" id="I." class="x">SPA</a><ul>
<div id="leftcontent">1.</div>
<li><a href="documents/I.01.PDF" id="124</a></li>
<div id="leftcontent">2.</div>
<li><a href="documents/I.02.PDF" id="111</a></li>
<div id="leftcontent">3.</div>
<li><a href="documents/I.03.PDF" id="122</a></li>
<div id="leftcontent">4.</div>
<li><a href="documents/I.04.PDF" id="121">121</a></li>
<div id="leftcontent">5.</div>
<li><a href="documents/I.05.PDF" id="123">123</a></li>
</ul>
</li>


css:
/* CSS Menus - Vertical CSS Menu with Popout and Dropdown Menus - 20050131 */

*{margin:0;padding:0;border:none;}

body{margin:0.5em 0.5em 0.5em 1.0em;font-size:100%;font-family:"Times New Roman", Times, serif;}

/* Begin CSS Popout Menu */

#left{
float: left; width: 7%;
top:22em;
font:bold .9em times new roman,arial,helvetica,sans-serif;
color:#FFFFFF;
background:#666666;
text-decoration:none;
display:block;
border-width:1px;
border-style:solid;
border-color:#ccc #888 #555 #bbb;
margin:0;
padding:2px 5px;
clear:both;
}

#leftcontent{
float: left; width: 7%;
top:22em;
font:bold .9em times new roman,arial,helvetica,sans-serif;
color:#FFFFFF;
background:#9A9A9A;
text-decoration:none;
display:block;
border-width:1px;
border-style:solid;
border-color:#ccc #888 #555 #bbb;
margin:0;
padding:2px 5px;
clear:both;
}

#menu{
float:inherit;
top:22em;
left:0.5em;
z-index:2;
width:37%;
padding-bottom:12em; /* To allow room for bottom dropdown */
clear: both;
}

#menu a, #menu h2{
font:bold .9em times new roman,arial,helvetica,sans-serif;
display:block;
border-width:1px;
border-style:solid;
border-color:#ccc #888 #555 #bbb;
margin:0;
padding:2px 5px;
overflow:hidden;
}

#menu h2{
color:#fff;
background:#000;
text-transform:uppercase;
}

#menu a{
color:#FFFFFF;
background:#9A9A9A;
text-decoration:none;
}

#menu a:hover{
color:#FFFFFF;
background:#9A9A9A;
}

#menu a:active{
color:#FFFFFF;
background:#9A9A9A;
}

#menu ul{
list-style:none;
margin:0;
padding:0;
width:30em;
}

/* Requirement: Put the element selector name (div)
onto non anchor hover selectors to force IE5 and
5.5 to correctly apply the csshover file. */

div#menu li, div#menu li:hover{
position:relative;
}

div#menu li ul{
position:absolute;
top:0;
left:100.1%;
display:none;}

div#menu ul ul,
div#menu ul ul ul,
div#menu ul li:hover ul ul,
div#menu ul li:hover ul ul ul
{display:none;}

div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display:block;}

/* End non-anchor hover selectors */

/* Styling for Expand */

#menu a.x, #menu a.x:visited{
background:#666666;
}

#menu a.x:hover{
color:#a00;
background:#ddd;
}

#menu a.x:active{
color:#060;
background:#ccc;
}

/* Begin Content Area */

#content{margin:0 0 0 10em;padding:0.5em;border:1px solid #000;}
#content a:link{color:#a00;}
#content a:visited{color:#a00;}
#content a:hover{color:#a00;background:#eee;}
#content a:active{color:#060;background:#ddd;}
#content h1, #content h2, #content h3{font:bold 1.0em arial,sans-serif;margin:0.5em 0.25em;padding:0;}
#content img{border:none;}
#content p{font:normal 0.8em/1.5em verdana,sans-serif;margin:1.0em;}
#content ul, #content ul ul{font:normal 0.9em/1.4em verdana,tahoma,arial,sans-serif;margin:1.0em 4.0em 1.5em 4.0em;}
#content ul li{font:normal 0.9em/1.4em verdana,tahoma,arial,sans-serif;margin:1.0em 0;}
#content ul ul li{font:normal 1.1em/1.6em verdana,tahoma,arial,sans-serif;margin:0;}
#content .fr{float:right;margin:0 0 1.0em 1.0em;}
#content .mod{font:normal .6em arial,sans-serif;margin:.25em;}
div.vv{position:relative;top:0;float:right;margin: 0 0 15px 15px;}

/* End Content Area */
May 16 '07 #2
drhowarddrfine
7,435 Expert 4TB
One quick observation, though it's mentioned in the comments about IE5, :hover doesn't work on anything but anchors in IE6, too.
May 16 '07 #3
ok. is there a fix? anything i can do?

thanks for the first tip...
May 16 '07 #4
drhowarddrfine
7,435 Expert 4TB
Haven't looked at this and it may be too late for you. We usually get around IEs bug by wrapping the element in an anchor. It isn't always as simple as just putting a <a> at the front of it, though.
May 16 '07 #5

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

Similar topics

25
by: James Goldwater | last post by:
I'm starting a new hopfully-commercial project soon, and I face a dilemma about whether Python with wxPython would be appropriate. The project has 3 main areas: a) manipulation of lists and...
82
by: Eric Lindsay | last post by:
I have been trying to get a better understanding of simple HTML, but I am finding conflicting information is very common. Not only that, even in what seemed elementary and without any possibility...
59
by: Lennart Björk | last post by:
Hi All, I have a tiny program: <!doctype HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>MyTitle</title> <meta...
11
by: Nathan Sokalski | last post by:
I add several JavaScript events (onchange, onkeypress, etc.) to Controls using the Add method of the Attributes collection. However, if the JavaScript code contains certain characters, such as & or...
11
by: Nathan Sokalski | last post by:
I add several JavaScript events (onchange, onkeypress, etc.) to Controls using the Add method of the Attributes collection. However, if the JavaScript code contains certain characters, such as & or...
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
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...
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...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

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.