Hola eiqqen
Aquí una posible solución:
La idea es centrar el ul dentro del div que lo contiene, en este caso menuback.
Para ello en #menuback ponemos text-align: center, para que el texto dentro de el quede centrado.
Luego al ul dentro menuback lo transformamos en display:inline-block;
Para evitar confusiones borre el id del ul, y me maneje directamente con "#menuback ul li".
Código HTML:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
body,td,th {
font-family: Arial, Helvetica, sans-serif;
}
body {
background-image: url(images/backdamask.png);
background-repeat: repeat;
}
#menuback {
background-color:#191818;
position:relative;
width:auto;
height:50px;
z-index:-1;
margin:0 auto;
padding:0px;
top:55px;
list-style-type:none;
text-align: center; /*con esto mas inline-block en ul centro la lista */
}
#menuback ul{
position:relative;
width:700px;/*este valor tiene que ser igual a la suma de cada li */
margin: 0 auto;
display:inline-block;/*para centrar el menu*/
}
#menuback ul li{
list-style:none;
position:relative;
float:left;
margin-left:5px;
top:5px;
border: 1px solid #06C;
}
#menuback ul li, #menuback a{height:36px; width:100px; display:block;}
<li id="inicio"><a href="index.html"></a></li> <li id="cocina"><a href="cocina.html"></a></li> <li id="sala"><a href="cocina.html"></a></li> <li id="recamara"><a href="cocina.html"></a></li> <li id="oficina"><a href="cocina.html"></a></li> <li id="contacto"><a href="cocina.html"></a></li>
Saludos y bienvenido al foro