Boas malta,
Tenho o seguinte menu:
Código :
com o seguinte css:
Código (CSS):
e o problema é: quando tenho o browser maximizado, tudo aparece normal. Assim que começo a minimizar, o menu começa a alterar-se, assim como os seus elementos (os li).
O que estou a fazer mal?
Tenho o seguinte menu:
Código :
<div class="menu">
<ul class="menu_nav">
<li id="menu_1"></li>
<li id="menu_2"></li>
<li id="menu_3"></li>
<li id="menu_4"></li>
<div class="clear"></div>
</ul>
</div>
<ul class="menu_nav">
<li id="menu_1"></li>
<li id="menu_2"></li>
<li id="menu_3"></li>
<li id="menu_4"></li>
<div class="clear"></div>
</ul>
</div>
com o seguinte css:
Código (CSS):
.menu {
position: absolute;
min-height: 0%; /*RESET*/
bottom: 0;
width: 100%;
height: 50px;
background: #3e3e3e;
z-index: 9999;
text-align: center;
}
.menu_nav {
display: inline-block;
vertical-align: top;
list-style-type: none;
}
.menu_nav li {
float: left;
padding-left: 50px;
padding-right: 50px;
height: 50px;
background-image: url(images/menu/home_i.png); /*TEMP*/
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
position: absolute;
min-height: 0%; /*RESET*/
bottom: 0;
width: 100%;
height: 50px;
background: #3e3e3e;
z-index: 9999;
text-align: center;
}
.menu_nav {
display: inline-block;
vertical-align: top;
list-style-type: none;
}
.menu_nav li {
float: left;
padding-left: 50px;
padding-right: 50px;
height: 50px;
background-image: url(images/menu/home_i.png); /*TEMP*/
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
e o problema é: quando tenho o browser maximizado, tudo aparece normal. Assim que começo a minimizar, o menu começa a alterar-se, assim como os seus elementos (os li).
O que estou a fazer mal?