Buenas...
Haciendo un par de pruebas me encontré con el siguiente problema...
Necesito que estos dos elementos (a y button) se muestren uno al lado del otro y centrados horizontalmente:
Código:
<a href="" class="boton link">Cancelar</a>
<form name="enviar" method="post">
<button type="submit" name="siguiente" class="boton" value="">Siguiente</button>
</form>
Logré ponerlos uno al lado del otro usando float, pero no he podido centrarlos...
¿Alguien sabe cómo hacerlo? Ya he probado de todo sin resultados...
Les dejo el código completo:
Código:
<!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>Prueba</title>
<style>
.boton {
background-color: #036;
background-image: url(imagenes/gradiente.png);
border: 1px solid #036;
color: #036;
cursor: pointer;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
height: 30px;
margin: 0 2px 0 2px;
text-transform: uppercase;
width: 100px;
}
.boton:hover {
background-color: #058;
color: #058;
}
.link {
display: block;
height: 28px;
line-height: 28px;
text-align: center;
text-decoration: none;
width: 98px;
}
</style>
</head>
<body>
<a href="" class="boton link">Cancelar</a>
<form name="enviar" method="post">
<button type="submit" name="siguiente" class="boton" value="">Siguiente</button>
</form>
</body>
</html>
Agradecería cualquier idea al respecto...
