Aligné à gauche de l'Étiquette - Aligner à Droite Sélectionner l'Élément (CSS)

J'ai un formulaire de mise en page que je veux afficher l'étiquette aligné à gauche et le contrôle de formulaire aligné à droite. J'ai essayé de le faire fonctionner à l'aide d'un float:right sur le formulaire de contrôle (dans ce cas ), puis en appliquant la clearfix classe, mais clearfix ne semble pas fonctionner sur ma boîte de sélection.

Est-il quelque chose de mal ici ou est-clearfix pas prévu pour fonctionner sur un élément select?

Lorsque je fais ceci, cependant, la boîte de sélection s'étend toujours à l'extérieur de la partie inférieure de la div contenant.

Mon Code:

<style type="text/css">
#category-select {
left: 0px;
top: 0px;
width: 350px;
border: 1px solid #666;
}
select#category {
float: right;
}
select.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
</style><!-- main stylesheet ends, CC with new stylesheet below... -->
<!--[if IE]>
<style type="text/css">
  select.clearfix {
    zoom: 1;  
  }  
</style>
<![endif]-->

<div id="triage">
    <div id="category-select">
          Category: 
          <select class="ipad-dropdown clearfix" id="category" name="category">
                <option value="A">A - Emergency
                <option value="B">B - Urgent
                <option value="C">C - ASAP
                <option value="D" selected>D - Standard
          </select>
    </div>
</div>
Si vous souhaitez que la zone de sélection pour être à l'extérieur de la boîte avec de la frontière, alors vous devez placer la balise select à l'extérieur de la "catégorie-sélectionnez" div.

OriginalL'auteur Barbs | 2011-12-07