Wybierz Wejścia i wejścia tekstowe w HTML-najlepszy sposób na równą szerokość?

Mam taką prostą formę (tylko w celach ilustracyjnych)...

<form>

   <div class="input-row">
      <label>Name</label>
      <input type="text" name="name" />
   </div>

   <div class="input-row">
      <label>Country</label>
      <select name="country">
         <option>Australia</option>
         <option>USA</option>
      </select>
   </div>

</form>

Moja metoda layoutu przy użyciu CSS jest następująca...

form  {
    width: 500px;
}

form .input-row {
    display: block;
    width: 100%;
    height: auto;
    clear: both; 
    overflow: hidden; /* stretch to contain floated children */
    margin-bottom: 10px;
}

form .input-row label {
    display: block;
    float: left;
}

form .input-row input,
form .input-row select {
    display: block;
    width: 50%;
    float: right;
    padding: 2px;
}

To wszystko ładnie wyrównuje, z tym, że mój element select (w Firefoksie tak czy inaczej) nie zawsze ma taką samą szerokość jak pozostałe elementy input. Na ogół jest węższy o kilka pikseli.

Próbowałem zmienić szerokość na rozmiar piksela (np. 200px), ale to nic nie zmieniło.

Jaki jest najlepszy sposób, aby te wszystkie miały takie same szerokość? Mam nadzieję, że nie ucieknie się do Ustawienia select's width indywidualnie, lub umieszczenie ich w tabelach...