CSS only select an element by a sibling's selector

Question

I have this html (snipped for brevity)

<label>
    <div class="label">Condition</div>
    <select>
        <option value="blah" selected="selected">Blah</option> 
        <option value="other...">other...</option>
    </select>
    <input type="text" name="condition" value="" style="display: none;">
</label>

I want to get the select element. The only static/non-generic factor I can see is the input[name='condition'] but the generic sibling selector won't help be because the 'select' comes before the input. So something like input[name='condition'] ~ select does not work.

This element moves, sometimes is the first, sometimes the twentieth and can be any and all locations in between so nth isn't going to work.

I know how to get this with Javascript/Jquery but that is not an option here. I only have CSS selectors available. So the big question is, is there any way to get the 'select' out of this HTML using only CSS selectors?

Is there any way to get a select element that has an option element with a value='something'?

Answer 1

Try this css code:

div.label ~ select

It returns any selects that are preceded by a div with class label.