title: Fieldset legend doesn't show properly when overflow
body: <p>I have a fieldset with a legend on it like the following</p>
  
  <pre><code>&lt;fieldset class="fieldsetStyle"&gt;
              &lt;legend class="fieldsetLegendStyle"&gt;
  
                  &lt;div&gt;
                       &lt;h:outputText value="#{msgs.LABEL_AJOUTER_UTILISATEUR}"
                           rendered="#{gProfilCtrl.newUtilisateur}"/&gt;
                       &lt;h:outputText value="#{msgs.LABEL_MODIFIER_UTILISATEUR}"
                           rendered="#{!gProfilCtrl.newUtilisateur}"/&gt;
                  &lt;/div&gt;
  
              &lt;/legend&gt;
  .
  .
  .
  &lt;/fieldset&gt;
  </code></pre>
  
  <p>when i set <code>overflow</code> property to <code>auto</code> in my CSS file the legend doesn't show properly. the top border disappear and this only in Chrome browser. firefox and IE work perfectly.</p>
  
  <p><img src="https://i.stack.imgur.com/rQIdm.png" alt="enter image description here"></p>
  
  <p>this is my css description:</p>
  
  <pre><code>.fieldsetStyle {
      height: calc(100% - 2px);
      border: 1px solid #bed6f8;
      margin-left: 5px;
      padding: 0 0 0 30px;
      width: calc(100% - 37px);
      margin-right: 0px;
      overflow: auto;
  }
  
  .fieldsetLegendStyle {
      border: 1px;
      border-style: solid;
      border-color: #BED6F8;
      min-width: 199px;
      height: 25px;
      padding-top: 10px;
      margin-bottom: 20px;
  
  }
  </code></pre>
  
  <p>any ideas ?</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>when i don't set <code>overflow:auto</code> my panel overflows from the fieldset box.</p>
  
  <p><img src="https://i.stack.imgur.com/exyNk.png" alt="enter image description here"> </p>