bootstrap: Fieldset legend does not work in bootstrap 5.0 beta-1

The following code does not work in v5.0 beta-1 while it perfectly works in v4.5.3

<fieldset class="border p-2">
   <legend  class="w-auto">Your Legend</legend>
</fieldset>

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Comments: 20 (5 by maintainers)

Most upvoted comments

fieldset class="border rounded-3 p-3" legend class="float-none w-auto px-3"

this should work!

Thanks alot guys using border rounded-3 p-3 on fieldset and float-none w-auto px-3 on legend sure worked for me

@TanvirArjel We’re all working on Bootstrap for free and beside our own jobs and life, please stop pressing.

FYI we added float: left; on legend on purpose to ease border customization: comment and commit.

If the bug you’re chasing is that legend does not overlap border anymore, this is not a bug since it’s intended. To get your legend funky again, you may use .float-none on them.

If that’s not the bug you’re describing, please describe it again as you only said “it does not work”, which is not really helpful.

@mdo Any update on this issue, please?

@MartijnCuppens I am expecting a response from you. Or if you think it’s a bug then please reopen the issue.

@mdo I am waiting to hear from you.

Thanks alot guys using border rounded-3 p-3 on fieldset and float-none w-auto px-3 on legend sure worked for me

yes its work fine,

float: none; tends to resolve any issues in terms of having the legend behave as a traditional HTML5 legend, as an immediate child of the fieldset element.