Question

Not sure if the title makes much sense, but here is what I’m trying to do.

<div class="mystyle">
    <select name="somename" id="somename">
       <option value="Value1">
       <option value="Value2">
    </select>
</div>
<div class="myotherstyle">
     <select name="somename" id="somename">
       <option value="Value1">
       <option value="Value2">
    </select>
</div>

Is it possible to style the select element in the div with class “mystlye” without setting the class on the select? I would like the select element to be styled only if it’s contained in a div that has a class of “mystyle”.

Something like this:

div.mystyle {
    border: 1px solid #ff0000;
    background-color: #ffeeee;  
}

div.mystyle.select {
    margin: 0px 5px 10px 0px;
}

Answer 1

Change the dot to a space in your div.mystyle.select selector. select is a tag not a class.

div.mystyle {
    border: 1px solid #ff0000;
    background-color: #ffeeee;  
}

div.mystyle select {
  margin: 0px 5px 10px 0px;
}

Demo: http://jsfiddle.net/LftRc/