Jak uzasadnić pola wprowadzania formularza za pomocą css?

Mam prosty formularz wejściowy do rejestracji (haml dla zwięzłości tutaj :)

%form#signup
  %fieldset
    %input.email{type:'text'}
    %br
    .name
      %input.first-name{type:'text'}
      %input.last-name{type:'text'}

i css:

#signup { width: 350px; }
fieldset { width: 100%; }
.name { width: 100%; }
.first-name { width: 30%; }
.last-name { /* occupy remainder of 'name' line */ }

Jak to stylizować, aby.email pole jest pełną szerokością polafieldset i.last-name i / lub.first-name pola rozszerzają się, aby również wypełnić całą szerokośćfieldset i przy prawej krawędzi wyrównanej z.email pole?

Tak, może być łatwiej użyćtable tutaj, ale czy istnieje css w prosty sposób? Musi działać tylko w przeglądarkach zgodnych z css3 i rozsądnie obniżyć poziom IE8 i 9.

link skrzypcowy:http://jsfiddle.net/3UP9H/1

questionAnswers(3)

yourAnswerToTheQuestion