Имам 1 лента и върху лентата меню като наместя под chrome стои добре няма разместване под Mozilla а под опера се дига нагоре около 100 пиксела даже изобщо не се вижда част от менюто търсих цсс хакове но не действат може ли това да е от неправилно кодване ето хтмл и цсс на лентата и менюто
[css].navigation {
background: url("../img/header_menu.png") repeat-x;
height: 55px;
width:100%;
position:fixed;
margin-top: -21px;
}
#menu {
}
ul a {
background-image: url(../img/line_menu.png);
background-repeat: no-repeat;
background-position: right;
padding-left: 32px;
display: block;
line-height: 19px;
text-decoration: none;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 21px;
color: #371C1C;
}
#menu .menu {position: fixed; margin:-96px 0 0 41%; background-color:white; border-radius: 7px;}
#menu li {
float:left;
}
#menu a {
background:url(../img/item.png) no-repeat left -274px;
font-family:'Trebuchet MS', Tahoma, Arial;
font-size:16px;
margin-left: 2px 0 0 9px;
line-height:24px;
color:#fff;
text-decoration:none;
text-transform:uppercase;
font-weight:normal;
text-shadow:#222 -1px -1px 0;
}
#menu.active a {
z-index:780;
position:relative;
margin: 7px 20px -2px -20px;
line-height:21px;
}
#menu.active li.back {
background:url(../img/item.png) no-repeat left -319px;
height:40px;
padding: 0;
position:absolute;
margin:-1px 0 0 -5px;
}
#menu.active li.back .left {
display:block;
padding: 0;
width:auto;
background:url(../img/item.png) no-repeat right -94px;
height:40px;
margin:0 5px 0 8px;
position:relative;
left:5px;
}
#menu.active li.current-back, #menu.active li.current-parent-back { background-position:left -364px; }
#menu.active li.current-back .left { background-position:right -184px; }[/css]
HTML:
<div class="navigation">
<div id="logo"></div>
</div>
<div id="cont">
<div id="menu">
<ul class="menu">
<li><a href="#"><img src="img/home.png" /></a></li>
<li><a href="#">Жени</a></li>
<li><a href="#">Мъже</a></li>
<li><a href="#">Търсачка</a></li>
<li><a href="#">Форум</a></li>
<li><a href="#">Класация</a></li>
</ul>
</div>[css].navigation {
background: url("../img/header_menu.png") repeat-x;
height: 55px;
width:100%;
position:fixed;
margin-top: -21px;
}
#menu {
}
ul a {
background-image: url(../img/line_menu.png);
background-repeat: no-repeat;
background-position: right;
padding-left: 32px;
display: block;
line-height: 19px;
text-decoration: none;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 21px;
color: #371C1C;
}
#menu .menu {position: fixed; margin:-96px 0 0 41%; background-color:white; border-radius: 7px;}
#menu li {
float:left;
}
#menu a {
background:url(../img/item.png) no-repeat left -274px;
font-family:'Trebuchet MS', Tahoma, Arial;
font-size:16px;
margin-left: 2px 0 0 9px;
line-height:24px;
color:#fff;
text-decoration:none;
text-transform:uppercase;
font-weight:normal;
text-shadow:#222 -1px -1px 0;
}
#menu.active a {
z-index:780;
position:relative;
margin: 7px 20px -2px -20px;
line-height:21px;
}
#menu.active li.back {
background:url(../img/item.png) no-repeat left -319px;
height:40px;
padding: 0;
position:absolute;
margin:-1px 0 0 -5px;
}
#menu.active li.back .left {
display:block;
padding: 0;
width:auto;
background:url(../img/item.png) no-repeat right -94px;
height:40px;
margin:0 5px 0 8px;
position:relative;
left:5px;
}
#menu.active li.current-back, #menu.active li.current-parent-back { background-position:left -364px; }
#menu.active li.current-back .left { background-position:right -184px; }[/css]