How do I create borders around tbody/thead sections of a table?

Question

I am attempting to create a page with tabular data, which must appear as multiple tables. I have two conflicting requirements to get around, however:

1. Each table m

Answer 1

Go with the method for creating the genuine tables, then try this.

I would just go with creating separate tables. Let's suppose each table looks like this:

        ...
    

    

        

            
Header 1
            
Header 2
        
    
    

        

            
Column 1
            
Column 2
        

Then, use jQuery to set the width:

var columnOneWidth = 0; var columnTwoWidth = 0;

$(document).ready( function() {
    $(".column_1").each( function() {
        if( $(this).css("width") > columnOneWidth ) columnOneWidth = $(this).css("width");
    });
    $(".column_2").each( function() {
        if( $(this).css("width") > columnTwoWidth ) columnTwoWidth = $(this).css("width");
    });

    $(".column_1").css({width: columnOneWidth + "px"});
    $(".column_2").css({width: columnTwoWidth + "px"});
});

All you have to do is include the jQuery Javascript file (available from jquery.com) in your head tag: