HTML: Spanning a form across multiple td columns -

I want to be able to do something like this in HTML. This is not a valid HTML, but it's intended:

  & lt; Table & gt; & Lt; TR & gt; & Lt; Th & gt; Name & lt; / Th & gt; & Lt; Th & gt; Favorite color & lt; / Th & gt; & Lt; Th & gt; & Nbsp; & Lt; / Th & gt; & Lt; Th & gt; & Nbsp; & Lt; / Th & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Form action = "/ updatePerson" method = "post" & gt; & Lt; Input name = "person_uuid" value = "550e8400-e29b-41d4-a716-446655440000" /> & Lt; Td> & Lt; Input name = "name" value = "john" gt; & Lt; / Td> & Lt; Td> & Lt; Input name = "favorite_golor" value = "green" /> gt; & Lt; / Td> & Lt; Td> & Lt; Input type = "submit" value = "edit person" /> gt; & Lt; / Td> & Lt; / Form & gt; & Lt; TD & gt; & Lt; Form action = "dillerson" method = "post" & gt; & Lt; Input name = "person_uuid" value = "550e8400-e29b-41d4-a716-446655440000" /> & Lt; Input type = "submit" value = "delete person" / & gt; & Lt; / Form & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Form action = "/ updatePerson" method = "post" & gt; & Lt; Input name = "person_uuid" value = "f47ac10b-58cc-4372-a567-0e02b2c3d479" /> & Lt; Td> & Lt; Input name = "name" value = "sally" /> gt; & Lt; / Td> & Lt; Td> & Lt; Input name = "favorite_dk" value = "blue" /> gt; & Lt; / Td> & Lt; Td> & Lt; Input type = "submit" value = "edit person" /> gt; & Lt; / Td> & Lt; / Form & gt; & Lt; TD & gt; & Lt; Form action = "dillerson" method = "post" & gt; & Lt; Input name = "person_uuid" value = "f47ac10b-58cc-4372-a567-0e02b2c3d479" /> & Lt; Input type = "submit" value = "delete person" / & gt; & Lt; / Form & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; / Table & gt;  

Obviously, I can not do this because I have & lt; Tr & gt; There should not be a form tag immediately inside the element. I can see that only one option is to use Javascript or to change the behavior of my program.

What could be a solution that would give me a form that would spread many such columns?

One option is to combine the columns with columns:

  & lt; Table & gt; & Lt; TR & gt; & Lt; Th & gt; Name & lt; / Th & gt; & Lt; Th & gt; Favorite color & lt; / Th & gt; & Lt; Th & gt; & Amp; Nbsp; & Lt; / Th & gt; & Lt; Th & gt; & Amp; Nbsp; & Lt; / Th & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td colspan = "4" & gt; & Lt; Form action = "/ updatePerson" method = "post" & gt; & Lt; Input name = "person_uuid" value = "550e8400-e29b-41d4-a716-446655440000" /> & Lt; Input name = "name" value = "John" /> & Lt; Input name = "favorite_color" value = "green" /> & Lt; Input type = "submit" value = "edit person" /> & Lt; / Form & gt; & Lt; Form action = "dillerson" method = "post" & gt; & Lt; Input name = "person_uuid" value = "550e8400-e29b-41d4-a716-446655440000" /> & Lt; Input type = "submit" value = "delete person" / & gt; & Lt; / Form & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td colspan = "4" & gt; & Lt; Form action = "/ updatePerson" method = "post" & gt; & Lt; Input name = "person_uuid" value = "f47ac10b-58cc-4372-a567-0e02b2c3d479" /> & Lt; Input name = "name" value = "sally" /> & Lt; Input name = "favorite_color" value = "blue" /> & Lt; Input type = "submit" value = "edit person" /> & Lt; / Form & gt; & Lt; Form action = "dillerson" method = "post" & gt; & Lt; Input name = "person_uuid" value = "f47ac10b-58cc-4372-a567-0e02b2c3d479" /> & Lt; Input type = "submit" value = "delete person" / & gt; & Lt; / Form & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; / Table & gt;  

and the layout style of the form element with CSS. Or you can go with a pure DIV based layout.