Mam problem z selektorami w css3.
Tutaj mam formularz prosty
<div class="container">
<nav></nav>
<form class="horizontal-form">
<fieldset>
<label for="username">User:</label>
<input type="text" id="username" name="username">
<label for="email">Email:</label>
<input type="email" id="email" name="email">
<label for="password">Password:</label>
<input type="password" name="password" id="password">
<label for="confirmPassword">Confirm Password:</label>
<input type="password" name="confirmPassword" id="confirmPassword">
<input type="button" class="centerButton" id="centerButton" value="Sign Up">
</fieldset>
</form>
</div>
Teraz chcę to formatować CSS:
@media screen and (min-width: 1080px){
.horizontal-form label{
margin-top: 10px;
display: inline-block;
width: 300px;
vertical-align: middle;
text-align: right;
}
.horizontal-form input{
margin-top: 10px;
display: inline-block;
vertical-align: middle;
width: 500px;
}
.horizontal-form input[type='button']{
margin-left: 305px;
width: 500px;
}
}
Jeżeli użyje .horizontal-form to jest wszystko OK
Jeśli spróbuje użyc klasy lub id centerButton CSS nie jest wykorzystywany...
Nie wiem co z tym zrobić,