Hi,
As I do not have IE7 on my computer, I was wondering if there is a
fault in my CSS Menu when using IE7.
Please can someone look at my site - http://www.worldofmonopoly.co.uk
and tell me if it works, and if it does not, tell me why it does not
work.
Thanks.
TycoonUK
-----------------------
Menu CSS File
..menu {
width: 956px;
font-size: 0.9em;
}
/* remove all the bullets, borders and padding from the default list
styling */
..menu ul {
padding: 0;
margin: 0;
list-style-type: none;
}
..menu ul ul {
width: 154px; /* */
}
/* float the list to make it horizontal and a relative positon so that
you can control the dropdown menu positon */
..menu li {
float: left;
width: 159px;
position: relative;
}
/* style the links for the top level */
..menu a,
..menu a:visited {
display: block;
font-size: 0.85em;
text-decoration: none;
color: #000000;
width: 154px;
height: 25px;
border: 1px solid #000000;
border-width: 1px;
background: #dddddd;
padding: 2px;
padding-left: 2px;
line-height: 29px;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a,
* html .menu a:visited {
width: 159px;
w\idth: 159px;
}
/* style the second level background */
..menu ul ul a.drop,
..menu ul ul a.drop:visited {
background: #dddddd;
}
/* style the second level hover */
..menu ul ul a.drop:hover {
background: #006699;
}
..meny ul ul :hover a.drop, {
background: #006699;
}
/* style the third level background */
..menu ul ul ul a,
..menu ul ul ul a:visited {
background: #dddddd;
}
/* style the third level hover */
..menu ul ul ul a:hover {
background: #006699;
}
..menu ul ul ul :hover a {
background: #006699;
}
/* hide the sub levels and give them a positon absolute so that they
take up no room */
..menu ul ul {
visibility: hidden;
position: absolute;
height: 0px;
top: 31px;
left: 0px;
width: 154px; /* */
}
/* another hack for IE5.5 */
* html .menu ul ul {
top: 33px;
t\op: 34px;
}
/* position the third level flyout menu */
..menu ul ul ul {
left: 159px; /* */
top: 0;
width: 154px; /* */
}
/* style the table so that it takes no part in the layout - required
for IE to work */
..menu table {
position: absolute; top:0; left:0;
}
/* style the second level links */
..menu ul ul a,
..menu ul ul a:visited {
background: #ffffff;
color: #000000;
height: auto;
line-height: 1em;
padding-left: 2px;
padding-top: 2px;
width: 154px /* */
}
/* yet another hack for IE5.5 */
* html .menu ul ul a,
..menu ul ul a:visited {
width: 159px; /* */
w\idth: 154px; /* */
}
/* style the top level hover */
..menu a:hover,
..menu ul ul a:hover {
color: #000000;
background: #006699;
}
..menu :hover a,
..menu ul ul :hover a {
color: #000000;
background: #006699;
}
/* make the second level visible when hover on first level list OR
link */
..menu ul li:hover ul,
..menu ul a:hover ul{
visibility:visible;
}
/* keep the third level hidden when you hover on first level list OR
link */
..menu ul :hover ul ul{
visibility:hidden;
}
/* keep the fourth level hidden when you hover on second level list OR
link */
..menu ul :hover ul :hover ul ul{
visibility:hidden;
}
/* make the third level visible when you hover over second level list
OR link */
..menu ul :hover ul :hover ul{
visibility:visible;
}
/* make the fourth level visible when you hover over third level list
OR link */
..menu ul :hover ul :hover ul :hover ul {
visibility:visible;
}
--------------------------
Menu HTML File
--------------------------
<!-- Menu Start -->
<div class="menu">
<ul>
<!-- Menu UK -->
<li><a href="#">United Kingdom<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul<!-- drop down menu items -->
<li><a class="drop" href="#">Original Board<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">The Properties</a></li>
<li><a href="#">The Different
Styles</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#" target="_self">70th Anniversary</a></li>
<li><a href="#">Bristol</a></li>
<li><a href="#">Cambridge</a></li>
<li><a class="drop" href="#">Nottingham<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">2001</a></li>
<li><a href="#">2003</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Northern Ireland</a></li>
<li><a href="#">Scotland</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!-- Menu USA -->
<li><a href="#">United States<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul<!-- drop down menu items -->
<li><a class="drop" href="#">Original Board<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">The Properties</a></li>
<li><a href="#">The Different Styles</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Boston</a></li>
<li><a href="#">New York</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!-- Europe -->
<li><a href="#">Europe<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul<!-- drop down menu items -->
<li><a class="drop" href="#">France</a><!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a class="drop" href="#">French Board<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">1936</a></li>
<li><a href="#">2003</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Lille</a></li>
<li><a href="#">Toulousse</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#">Germany<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a class="drop" href="#">German Board<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">1936</a></li>
<li><a href="#">2003</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Hamburg</a></li>
<li><a href="#">Munich</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Spain</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!-- Rest of the World -->
<li><a href="#">World<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul<!-- drop down menu items -->
<li><a href="#">Argentina</a></li>
<li><a class="drop" href="#">Australia<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a class="drop" href="#">Australian Board<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">1936</a></li>
<li><a href="#">2003</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Regionals/Specials</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">China</a></li>
<li><a href="#">Japan</a></li>
<li><a class="drop" href="#">New Zealand<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a
href="/world/newzealand/original/index.php">Original Board</a></li>
<li><a href="#">Starship 2001</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Russia</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!-- Other Editions -->
<li><a href="#">Other Editions<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul<!-- drop down menu items -->
<li><a class="drop" href="#">Cartoons<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">Looney Tunes</a></li>
<li><a class="drop" href="#">Pokemon<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">1999</a></li>
<li><a href="#">2000</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Powerpuff Girls</a></li>
<li><a href="#">Sponge Bob Squarepants</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#">Disney<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">Mickey Mouse 75th -
2004</a></li>
<li><a href="#">Original - 2001</a></li>
<li><a href="#">Pixar - 2005</a></li>
<li><a href="#">Pop-Up Castle - 2005</a></li>
<li><a href="#">Theme Park - 2002</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#">Film / Television<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a class="drop" href="#">Batman
Franchise<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">Batman and
Robin</a></li>
<li><a href="#">Batman</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Lord Of The Rings</a></li>
<li><a href="#">Star Trek</a></li>
<li><a href="#">Star Wars</a></li>
<li><a href="#">Spiderman</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#">Sports<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a class="drop" href="#">American
Football<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">New England
Patriots</a></li>
<li><a href="#">Tampa Bay
Buccanneers</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#">Football
(Soccer)<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">Arsenal</a></li>
<li><a href="#">Chelsea</a></li>
<li><a href="#">FIFA World Cup
France 98</a></li>
<li><a
href="/other/sport/football/germany06/index.php">FIFA World Cup
Germany 2006</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="#">Major League
Baseball (mlb)<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">Boston Red Sox</a></li>
<li><a href="#">Florida Marlins</a></li>
<li><a href="#">New York
Yankees</a></li>
<li><a href="#">Tampa Bay Devil
Rays</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Fishing</a></li>
<li><a href="#">National Hockey League
(NHL)</a></li>
<li><a href="#">Snowboarding</a></li>
</ul>
<!--[if lte IE
6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#">Other Licensed</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!-- Menu Extras and Information-->
<li><a href="#">Extras and Information<!--[if IE
7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul<!-- drop down menu items -->
<li><a href="/index.php" target="_self">Home</a></li>
<li><a href="#">RSS Feed</a></li>
<li><a
href="http://www.worldofmonopoly.co.uk/blog/blogger.html"
target="_blank">Blog</a></li>
<li><a
href="http://www.worldofmonopoly.co.uk/store/index.php"
target="_self">Monopoly Shop</a></li>
<li><a href="/history/index.php"
target="_self">Monopoly History</a></li>
<li><a href="/board/index.php"
target="_self">Monopoly Board</a></li>
<li><a href="#" target="_self">FAQ</a></li>
<li><a href="/new/index.php" target="_self">New
Releases</a></li>
<li><a href="/sitemap/index.php" target="_self">Site
Map</a></li>
<li><a href="/extras/index.php" target="_self">Mailing
List / Guestmap</a></li>
<li><a href="/links/index.php"
target="_self">Links</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</div>
<!-- Menu End -->
<!-- Changeable Content Start -->