part II

A floated sidebar, contains a table. No problems there, as the sidebar container has a (pixel-) defined width. A main contents area, with a red border (static <div>, width defined only by margins).

The tables should be as wide as the main contents, and not drop under the sidebar.


 icon a table, no width is declared; without a wrapper

cell1 cell2 cell3 cell4
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam ultricies, metus sed rutrum dignissim, leo dui sollicitudin sapien, sit amet sagittis est metus ut erat. Maecenas sollicitudin. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

 icon a table, no width is declared - but a width (25%) is declared on the <col> element; without a wrapper

cell1 cell2 cell3 cell4
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam ultricies, metus sed rutrum dignissim, leo dui sollicitudin sapien, sit amet sagittis est metus ut erat. Maecenas sollicitudin. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

 icon a table, no width declared; equally size cells (width on the <col> element); within a wrapper (width:99%)

cell1 cell2 cell3 cell4
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam ultricies, metus sed rutrum dignissim, leo dui sollicitudin sapien, sit amet sagittis est metus ut erat. Maecenas sollicitudin. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

 icon a table, width declared (100%); equally size cells; within a wrapper (width:99%)

cell1 cell2 cell3 cell4
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam ultricies, metus sed rutrum dignissim, leo dui sollicitudin sapien, sit amet sagittis est metus ut erat. Maecenas sollicitudin. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.