Est-il possible d'avoir un fieldset largeur seulement être aussi large que le contrôle de ceux-ci?

Question

Il semble que fieldset par défaut à 100% de la largeur de son conteneur. Est-il possible que vous pouvez avoir le champ situé juste à être aussi grand que le plus grand contrôle à l'intérieur de la fieldset?

Answer 1

Utiliser display: inline-block, si vous avez besoin d'envelopper à l'intérieur d'un DIV pour le garder de l'afficher en ligne. Testé dans Safari.

<style type="text/css">
    .fieldset-auto-width {
         display: inline-block;
    }
</style>
<div>
  <fieldset class="fieldset-auto-width">
      <legend>Blah</legend>
      ...
  </fieldset>
</div>

Answer 2

fieldset {display:inline} ou fieldset {display:inline-block}

Si vous souhaitez séparer les deux balises html fieldsets verticalement, utilisez un seul <br/> entre eux. C'est sémantiquement correct et pas plus difficile qu'il doit être.

Answer 3

Vous pourrait flotter, il sera seulement aussi vaste que son contenu, mais vous devrez assurez-vous de vider ces flotteurs.

Answer 4

Malheureusement, ni display:inline-block ni width:0px fonctionne dans Internet Explorer jusqu'à la version 8. Je n'ai pas essayé Internet Explorer 9. Comme je le souhaiterais à ignorer Internet Explorer, je ne peux pas.

La seule option qui fonctionne sur Firefox et Internet Explorer 8 float:left. Le seul petit inconvénient est que vous avez à retenir pour utiliser clear:both sur l'élément qui suit la forme. Bien sûr, il sera très évident si vous oublier ;-)

Answer 5

Vous pouvez toujours utiliser les CSS pour contraindre la largeur de la fieldset, ce qui permettrait de limiter les contrôles à l'intérieur.

Je trouve que j'ai souvent à limiter la largeur de l' select des contrôles, ou autrement vraiment de l'option de texte fera totalement ingérable.