Quick Question about Classes in Styled Forms

Form Class Question...

[drbigfresh]

I have a form that looks like this:

<form method="POST" id="aligned" />
<label for="state">State:</label>
<select name="state" >
<option value=" ">-Unspecified-</option>
</select>

<select name="country" class="forminline" >
<option value="1"></option>
</select>

Now what I am trying to do is to display the country drop down directly after the state, but I can't seem to over ride the default settings for my form css. My css looks like this:

#aligned label { position: absolute; text-align:right; width:165px; }
#aligned input, #aligned textarea, #aligned select { margin-left: 185px; }
#aligned label.check, #aligned label.radio { position:relative; text-align:left; }

.forminline {
margin-left: 5px;
background:#ccc;
}

Now no matter what I do the Country drop down has the 185px left margin, even though the .forminline tries to over ride it. What am I doing wrong?

Thanks!

[swa66]

I think this is a case of specificity.

Try being more specific with the override e.g:

#aligned select.forminline {margin-left: 5px;background:#ccc;}

[drbigfresh]

you're a genius. And of course, the only variation I hadn't tried.

Thanks.