CODEWITHSUNDEEP
htmlcsslabelinlinefieldset
John Bernal
John Bernal

Reputation: 250

HTML Placing fieldsets/Labels adjacent

So I have two fieldsets, wrapped in in one label that I want to display adjacent to each other. Here's my code: fiddle

So the two fieldsets containing the input boxes and instructions respectively should appear side-by-side. What should I change/add in my code to make it work? Thanks

Upvotes: 0

Views: 2756

Answers (3)

Paul S.
Paul S.

Reputation: 66334

Do the fieldsets styled as display: inline-block; ( http://jsfiddle.net/5brSk/16/ ) to get them side-by-side, and don't use a label as the parent - use it's form or a div / span. There are countless other things that make your code invalid though (duplicate IDs etc)

Upvotes: 0

sonnyhe2002
sonnyhe2002

Reputation: 2121

If you want the two fieldsets side by side, you can use a table structure

<label>
  <table>
    <tr>
      <td>
        //field set 1
      </td>
      <td>
        //field set 2
      </td>
    </tr>
  </table>
</label>

Add some css to fix it in the end. And technically there is no need for the label tag.

Upvotes: 0

Gung Foo
Gung Foo

Reputation: 13558

having the fieldsets float: left; will work fine.

look at this: http://jsfiddle.net/5brSk/2/

You will have to make sure that the container of your 2 fieldsets is large enough to hold both fieldsets next to each other, otherwise it will break (again).

Upvotes: 1

Related Questions