Hola, tengo un código sencillo, de hecho es un solo formulario, y ya he manejado Css antes, pero no me habia pasado que se movieran las capas, es decir, al aumentar un borde o aumentar el tamaño del texto(en el :hover) se ve como se mueve el contenido que está abajo del formulario, esto al poner y quitar el puntero del boton submit.
Código HTML:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title><style type="text/css">
<!--
form{background:#FFFF66;
color:#FF0000;
margin-top:50px;
margin-left:200px;
width:350px;
padding:8px;
padding-left:20px;
border-style:wave;
}
#button{
color:#FF0000;
background:#fff;
border-bottom:#CCCCCC 1px solid;
border-right:#CCCCCC 1px solid;
}
#button:hover{
color:#FF0000;
background:#fff;
border-bottom:#aaa 6px solid; /* Al aumentar tamaño del borde */
border-right:#aaa 2px solid; /* se modifican las capas de abajo */
/*cursor:pointer; */
}
input{
background:#ECFFEC;
}
-->
</style>
</head>
<body>
<form id="form1" name="form1" method="GET" action="">
<label for="DL">envio</label>
<input type="text" name="AWB" id="L" />
<label for="button"> </label>
<input type="submit" name="button" id="button" value="buscar" />
</form> Contenido que de mueve al poner y quitar el puntero del boton. Contenido que de mueve al poner y quitar el puntero del boton. Contenido que de mueve al poner y quitar el puntero del boton. Contenido que de mueve al poner y quitar el puntero del boton.
De hecho no sé si nunca me habia pasado por que normalmente uso varias capas!
Podrian decirme cómo puedo solucionar esto que realmente ya no sé si es simple.
Por su ayuda gracias...!