Jump to content

Quick Question about Classes in Styled Forms


drbigfresh

Recommended Posts

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!

 

 

Take this out "#aligned select" and then you should not have that problem; it should then look like this:

 

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

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

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.