ayuda,problema con menu

[joseomaker]

Código HTML:

<div id="menu" class="cont">
<div id="contmenu">
<div class="boton"><p>boton1</p></div>
<div class="boton"><p>boton2</p></div>
</div>
</div>
 

Código CSS:

.cont {
position: relative;
margin: 0 auto;
width: 100%;
}
.boton {
background-image: url(../img/boton.png);
display: table-cell;
vertical-align: middle;
position: relative;
height: 42px;
padding-right: 5px;
}
.boton p {
color: white;
font-weight: bold;
}
.boton p a {
text-decoration: none;
}
.boton:hover {
background-image: url(../img/boton_hover.png);
}
#menu {
border: 1px solid black;
background-image: url(../img/boton.png);
text-align: center;
height: 42px;
}
#contmenu {
display: table;
background-image: url(../img/boton.png);
position: relative;
margin: 0 auto;
height: 42px;
width: 782px;
}
 

el problema es el siguiente: cuando voy a probarlo resulta que se forma esto:

http://img195.imageshack.us/i/screenmenu.jpg/

ven?,la linea gris de la muerte que aparece abajo del menu,como solucionar esto?,ayudenme...

Saludos

[Kamae]

Buenas!

He estado haciendo pruebas y el problema posiblemente esté en la imagen que usas en los botones que es más grande que el height del div #contmenu
He copiado tu código (aunque me he servido de mis imágenes) y me ocurría lo mismo, y modificando el height he conseguido que se viera bien.

Comprueba qué altura tiene la imagen boton.png y verifica que no supera los 42px que son los que tienes definidos en el height del #contmenu en CSS.

Si no se arregla así, te recomiendo que añadas un border en #contmenu:

Código PHP:

  #contmenu {
    display: table;
    background-image: url(../cables/img/dsg/topmig.jpg);
    position: relative;
    margin: 0 auto;
    height: 52px;
    width: 782px;
    border-style:solid;
    border-width:1px;
}  
   

Así verás hasta dónde llega esa capa, y podrás "jugar" tocando los demás heights hasta que los alinees. Ten en cuenta que si pones un border de 1px, y el height es de 10px, en realidad son 12px (sus propios 10px, más 1px de borde inferior y 1px de borde superior)

Espero que te sirva
Saludos!

[joseomaker]

eso no a logrado solucionar nada,ya comprobe las imagenes T.T

[joseomaker]

lo e logrado,solo use un reset CSS y ya :p