Mám vysouvací menu udělané pouze přes CSS ( a *.htc soubor ). Předělával jsem stránku do Matrjošky a od té doby je menu v IE5.5 a nižším celé rozchruté. Doložím zdroje a obrázky.
/* Matrjoška box-left - vnější div */
.box-left-out {
float: left;
width: 150px;
margin: 5px 0;
}
/* vnitřní div */
.box-left {
background: #FFF url(../images/SilverBlue/title_empty.gif) no-repeat;
border: 1px solid #335ea8;
text-decoration: none;
}
ul.sub {
position: absolute;
z-index: 10;
visibility: hidden;
left: 148px;
top: 0;
background: #fff;
padding: 5px;
border: 1px solid #335ea8;
}
li.mainHover ul.sub { visibility: visible; }
.box-left ul {
margin: 0;
padding: 0;
width: 148px;
font-size: 12px;
}
.box-left ul, .box-left ul.sub {
list-style-type: none;
background: #fff url(../images/SilverBlue/menu_li_bg.gif) repeat-y;
margin-left: 0;
margin: 0;
padding: 0;
width: 100%;
}
.box-left ul.sub { width: 180px; }
.box-left li {
width: 148px;
/*width: 100%;*/
}
.box-left li, .box-left ul.sub li {
margin: 0;
padding: 0;
}
.box-left h3 {
background: #fff url(../images/SilverBlue/menu_li_bg.gif);
font-weight: normal;
padding: 0;
}
.box-left h3 a {
display: block;
width: 100%;
height: 19px;
padding: 3px 0 1px 0;
color: black;
text-decoration: none;
}
.box-left h3 a:hover {
width: 147px;
background: #335ea8 url(../images/SilverBlue/menu_li_bg_active.gif);
text-decoration: none;
color: white;
}
.box-left ul.sub li {
display: block;
width: 100%;
margin: 0;
padding: 0;
}
.box-left ul.sub li a {
display: block;
width: 180px;
height: 19px;
padding-top: 3px;
margin: 0;
color: #000;
text-decoration: none;
}
.box-left ul.sub li > a {
width: 180px;
}
.box-left ul.sub li a:hover {
background: #335ea8 url(../images/SilverBlue/menu_li_bg_active.gif) repeat-y;
color: white;
}
.box-left ul li.main:hover h3 a {
background: #335ea8 url(../images/SilverBlue/menu_li_bg_active.gif) repeat-y;
color: white;
}
.box-left ul li.main {
position: relative;
}
.box-left ul li > ul.sub {
position: absolute;
z-index: 10;
visibility: hidden;
}
.box-left ul li.main:hover ul.sub {
visibility: visible;
}
.box-left ul li.main h3.main_sub a {
width: 147px;
background: #fff url(../images/SilverBlue/menu_li_bg_sub.gif);
color: black;
}
.box-left ul li.main:hover h3.main_sub a {
width: 147px;
background: #335ea8 url(../images/SilverBlue/menu_li_bg_active_sub.gif);
color: white;
}
.box-left ul li.main h3.main_sub a:hover {
width: 147px;
background: #335ea8 url(../images/SilverBlue/menu_li_bg_active_sub.gif);
color: white;
}
