Hola,
Mi problema es que tengo en mi código .CSS lo siguiente para la estructura <form>:
form, .content {
font-family: Arial, Helvetica, sans-serif; /*Not yet a member? Sign up*/
width: 30%;
margin: 0px auto;
padding: 20px;
border: 1px solid #595959; /*Border register*/
background: white;
/*border-radius: 0px 0px 10px 10px;*/
}
Pero me gustaría que fuese diferente para el botón que tengo:
<form action="#" method="post">
<input type="hidden" id="hiddenfield" name="hiddenfield">
<button class="button" name="search">Search</button>
</form>
Que lo quiero con estas características:
.button {
display: block;
margin: auto;
border: none;
color: black;
padding: 8px 40px;
text-align: center;
text-decoration: none;
font-size: 16px;
cursor: pointer;
}
button:hover {
background:#333333;
color: white;
}
Sin embargo, el .CSS de la estructura <form> también se aplica para el botón. Me gustaría diferenciarlo, pero no se como. He probado de varias maneras, entre ellas esta:
form, .button {
display: block;
margin: auto;
border: none;
color: black;
padding: 8px 40px;
text-align: center;
text-decoration: none;
font-size: 16px;
cursor: pointer;
}
y he probado a poner style="border:none" al botón pero no consigo quitar el borde.
Me podríais ayudar?
Gracias
Prueba:
form > button {
}