Hi
I have not checked my site in mobiles, and one person said that my css menu dont appear at all on her blackberry.....not that its not working, it just dont appear.
The css menu is Peterned whatever hover, I dont know if the problem could be in the menu or the surrounding css.
This is my doctype:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
This is the menus css:
#menu {
float: left;
margin:0;
padding:0 5px 0 5px;
\width: 778px;
w\idth: 756px;}
#menu ul {
list-style: none;
margin: 0;
padding: 0;
width: 108px;
float: left;
}
#menu ul ul ul .level3{
\width: 350px;
w\idth: 325px;
}
#menu ul ul .level4{
\width: 275px;
w\idth: 235px;}
#menu ul ul .level5{
\width: 260px;
w\idth: 220px;}
#menu ul ul .level6{
width: 195px;
}
#menu ul ul .level7{
\width: 123px;
w\idth: 113px;}
#menu p {
display: block;
border: 1px solid;
border-color: #ccc #888 #555 #bbb;
margin: 0;
padding: 2px 3px;
color: #000099;
text-align:center;
background:url("background5.gif");
font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; font-weight:bold;
}
#menu ul ul .level2{
display: block;
border: 1px solid;
border-color: #ccc #888 #555 #bbb;
margin: 0;
color: #000099;
background: #FFFFFF;
text-align:left;
font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; padding-left:1px; padding-top:3px; padding-bottom:3px;
text-decoration:none;
\width: 285px;
w\idth: 245px;}
#menu a{
display: block;
border: 1px solid;
border-color: #ccc #888 #555 #bbb;
margin: 0;
color: #000099;
background: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; padding-left:1px; padding-top:3px; padding-bottom:3px;
text-decoration:none;
}
#menu ul ul .level2:hover {
color: #000099;
background: #FFFF99;
}
#menu a:hover {
color: #000099;
background: #FFFF99;
}
#menu li:hover {
position: relative;
z-index: 500;
}
#menu ul ul {
position: absolute;
}
#menu ul ul ul {
top: -1px;
left: 100%;
}
div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover 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;}
The menu itself is nothing strange, just a list,
a piece of the menu:
<ul>
<li><p>Home <img src="new_arrow_down.gif" alt="Arrow down" border="0"></p>
<ul>
<li><a class="nivel1" href="index.htm">Homepage</a></li>
</ul>
</li>
</ul>
<ul>
<li><p>About Us <img src="new_arrow_down.gif" alt="Arrow down" border="0"></p>
<ul>
etc....
If somebody please can help, thanks in advance.
Helen
