title: Fluid input elements
body: <p>I got this form...</p>
  
  <pre><code>&lt;form method="post" action="&lt;?php echo htmlentities($_SERVER['PHP_SELF']); ?&gt;"&gt;
      &lt;fieldset&gt;
          &lt;legend&gt;Who are you?&lt;/legend&gt;
          &lt;label for="first-name"&gt;First name&lt;/label&gt;&lt;input type="text" name="first_name" required /&gt;&lt;br /&gt;
          &lt;label for="last-name"&gt;Surname&lt;/label&gt;&lt;input type="text" name="last_name" required /&gt;&lt;br /&gt;
          &lt;label for="email"&gt;E-mail&lt;/label&gt;&lt;input type="email" name="email" required /&gt;&lt;br /&gt;
          &lt;input type="button" name="submit1" id="submit1" value="Next" /&gt;
          &lt;input type="button" name="clear" id="clear" value="Clear" /&gt;
      &lt;/fieldset&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>With this CSS…</p>
  
  <pre><code>form {
      margin: 24px 0 0 0;
  }
  
  form legend {
      font-size: 1.125em;
      font-weight: bold;
  }
  
  form fieldset {
      margin: 0 0 32px 0;
      padding: 8px;
      border: 1px solid #ccc;
  }
  
  form label {
      float: left;
      width: 125px;
  }
  
  form label, form input {
      margin: 5px 0;
  }
  </code></pre>
  
  <p>I'm looking for an easy way to make the input fields fluid so that the width of input elements is always relative to the width of the fieldset element. In other words, the width of the label (125px) and input element should always be 100% of the width of the fieldset element. Is there an easy way to do this (without adding divs)?</p>