How to put table in a table? - html

I need to make a table with more tables, but i dont know how to put this tables inside
It should look like this
i need to do this without CSS
I have tried something...well it turns out like this
I don't understand how to make it


This is a HTML lesson for tables as well as colspan and rowspan attributes:
<body>
<table>
<td>spaltenweise</td>
<td>
<table>
<td colspan="4">A04_03a</td>
<tr>
<td>Spale 1</td>
<td>Spalte 2</td>
<td>Spalte 3</td>
<td>Spalte 4</td>
</tr>
<tr>
<td colspan="4">Spalte 1+2+3+4</td>
</tr>
</table>
</td>
<td>
<table>
<td colspan="4">A04_03b</td>
<tr>
<td>Spale 1</td>
<td>Spalte 2</td>
<td>Spalte 3</td>
<td>Spalte 4</td>
</tr>
<tr>
<td colspan="2">Spalte 1+2</td>
<td colspan="2">Spalte 3+4</td>
</tr>
</table>
</td>
<td>
<table>
<td colspan="4">A04_03c</td>
<tr>
<td>Spalte 1</td>
<td>Spalte 2</td>
<td>Spalte 3</td>
<td>Spalte 4</td>
</tr>
<tr>
<td colspan="1">Spalte 1</td>
<td colspan="3">Spalte 2+3+4</td>
</tr>
</table>
</td>
<tr>
<td>zeilenweise</td>
<td>
<table>
<tr colspan="3">A04_03d</tr>
<tr>
<td>Zeile 1</td>
<td rowspan="4">Zeile 1+2+3+4</td>
</tr>
<tr>
<td>Zeile 2</td>
</tr>
<tr>
<td>Zeile 3</td>
</tr>
<tr>
<td>Zeile 4</td>
</tr>
</table>
</td>
<td>
<table>
<tr colspan="3">A04_03e</tr>
<tr>
<td>Zeile 1</td>
<td rowspan="2">Zeile 2+3</td>
</tr>
<tr>
<td>Zeile 2</td>
</tr>
<tr colspan="3"></tr>
<tr>
<td>Zeile 3</td>
<td rowspan="2">Zeile 2+3</td>
</tr>
<tr>
<td>Zeile 4</td>
</tr>
</table>
</td>
<td>
<table>
<tr colspan="3">A04_03f</tr>
<tr>
<td>Zeile 1</td>
<td>1</td>
</tr>
<tr>
<td>Zeile 1</td>
<td rowspan="3">Zeile 2+3+4</td>
</tr>
<tr>
<td>Zeile 3</td>
</tr>
<tr>
<td>Zeile 4</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>


<table>
<tr>
<td style="border:1px solid black;">
Spaltenweise
</td>
<td style="border:1px solid black;">
<table>
<tr>
<td style="border:1px solid black;">
A04
</td>
</tr>
<tr>
<td style="border:1px solid black;">
100
</td>
<td style="border:1px solid black;">
200
</td>
<td style="border:1px solid black;">
300
</td>
</tr>
<tr >
<td colspan=3 style="border:1px solid black;">
spalte 1 2 3 4
</td>
</tr>
</table>
</td>
</tr>
</table>

Related

padding between table components not working

I have a table.
<table style="margin-left: 20px" class="tg">
<tbody>
<tr>
<td class="tg- 0lax">Question 1</td>
</tr>
<tr>
<td class="tg-0lax">Answwer 1</td>
</tr>
<tr>
<td class="tg- 0lax">Question 2</td>
</tr>
<tr>
<td class="tg- 0lax">Answer 2</td>
</tr>
I want the margin between the question 1 and the answer 1 2px. And the margin between the answer 1 and question 2 , 10 px. I cant get i done. I did try the following things: style="margin-bottom / margin-top in the and , al well as padding 2px. But both doesnt work

<td></td> and <tr></tr> cant be given a margin. Although you can give them a padding when you set display: block; Then you can go on an set things like every second one should get a bigger padding at the bottom (as you wanted it). Here is a snippet with very basic styles:
tr {
display: block;
}
tr:nth-child(even) {
padding-bottom: 20px;
}
tr:nth-child(odd) {
padding-bottom: 2px;
}
<table>
<tbody>
<tr>
<td>Question 1</td>
</tr>
<tr>
<td>Answer 1</td>
</tr>
<tr>
<td>Question 2</td>
</tr>
<tr>
<td>Answer 2</td>
</tr>
</tbody>
</table>

Set border-spacing property 2px to the table, and then skip 5 rows to get 10px something like this:
<table style="margin-left: 20px;border-spacing: 2px;" class="tg">
<tbody>
<tr>
<td class="tg- 0lax" >Question 1</td>
</tr>
<tr>
<td class="tg-0lax">Answwer 1</td>
</tr>
<tr>
<td class="tg-0lax"></td>
</tr>
<tr>
<td class="tg-0lax"></td>
</tr>
<tr>
<td class="tg-0lax"></td>
</tr>
<tr>
<td class="tg-0lax"></td>
</tr>
<tr>
<td class="tg- 0lax">Question 2</td>
</tr>
<tr>
<td class="tg- 0lax">Answer 2</td>
</tr>

How to separate nested table conspicuously?

How can i separate nested table in lower table as conspicuously as in upper table?
Upper table is not proper though.
I am trying to get Settlements Finance Time 3 Time 5 Bad Good in a single line in lower table.
Here is my code:
.my-table {
border: 1px solid #000;
}
.my-table tr:nth-child(even) {
background: #ddd;
}
.my-table tr:nth-child(odd) {
background: #fff;
}
<table class="my-table">
<tr>
<th>Service</th>
<th>Provider</th>
<th>Check</th>
<th>Marker</th>
<th>Captured Time</th>
<th>Final Time</th>
<th>Status</th>
<th>Comments</th>
</tr>
<tr>
<th>Sub Heading</th>
</tr>
<tr>
<td>Custody C</td>
<td>I</td>
<td>
<table>
<tr>
<td>Settlements</td>
<td>Finance</td>
<td>Time 3</td>
<td>Time 5</td>
<td>Bad</td>
<td>Good</td>
</tr>
</table>
<table>
<tr>
<td>Crossroad</td>
<td>
<table>
<tr>
<td>Complete</td>
</tr>
<tr>
<td>Partial</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>Time 4a</td>
</tr>
<tr>
<td>Time 4b</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>Time 6a</td>
</tr>
<tr>
<td>Time 6b</td>
</tr>
</table>
</td>
<td>Ok</td>
<td>danke</td>
</tr>
</table>
</td>
</tr>
</table>
<br>
<table class="my-table">
<tr>
<th>Service</th>
<th>Provider</th>
<th>Check</th>
<th>Marker</th>
<th>Captured Time</th>
<th>Final Time</th>
<th>Status</th>
<th>Comments</th>
</tr>
<tr>
<th>Sub Heading</th>
</tr>
<tr>
<td>Custody T</td>
<td>G</td>
<td>
<table>
<tr>
<td>Trades</td>
</tr>
<tr>
<td>Position</td>
</tr>
</table>
</td>
<td>Latest</td>
<td>TIME 1</td>
<td>TIME 2</td>
<td>Good</td>
<td>My Comments</td>
</tr>
<tr>
<td>Custody C</td>
<td>I</td>
<td>
<table>
<tr>
<td>Settlements</td>
</tr>
<tr>
<td>Crossroad</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>Finance</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>Complete</td>
</tr>
<tr>
<td>Partial</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>Time 3</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>Time 4a</td>
</tr>
<tr>
<td>Time 4b</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>
Time 5
</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>Time 6a</td>
</tr>
<tr>
<td>Time 6b</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>Bad</td>
</tr>
<tr>
<td>Ok</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>Good</td>
</tr>
<tr>
<td>danke</td>
</tr>
</table>
</td>
</tr>
<tr>
</tr>
</table>

To answer the question:
I am trying to get Settlements Finance Time 3 Time 5 Bad Good in a single line in lower table.
Vertically aligning your table cells will bring the content to the top of the cells, regardless of how many lines of content follows.
.my-table td {
vertical-align: top;
}
JSFiddle Example: https://jsfiddle.net/jennifergoncalves/y1Lr0mzw/
Please let me know if I missed what you were trying to accomplish.

Make two cells in same row of 2 tables have same width

I have 2 tables in same row of the big table, like this:
<table>
<tr>
<td>Type</td>
<td>Storage 1</td>
<td>Storage 2</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>Type A</td>
</tr>
<tr>
<td>Type B</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>10%</td>
</tr>
<tr>
<td>90%</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>40%</td>
</tr>
<tr>
<td>60%</td>
</tr>
</table>
</td>
</tr>
<table>
But when the text in first column (e.g. "Type A") is too long, it makes a new line. Then data in same row is not in same row. ("Type B" is not in same row with "90%" and "60%")
Return data is in xml format, like this:
<DataGroup Storage="Storage 1">
<DataRow Type="Type A" Percentage="10%"/>
<DataRow Type="Type B" Percentage="90%"/>
</DataGroup>
<DataGroup Storage="Storage 2">
<DataRow Type="Type A" Percentage="40%"/>
<DataRow Type="Type B" Percentage="60%"/>
</DataGroup>
I have to draw borders to make it look like one table. Render in cshtml file.
How can I resolve this? Many thanks.

You can add the border: 1px solid black; to CSS to make it like a table. For HTML, you just need one table.
table,
th,
td {
border: 1px solid black;
}
<table>
<tr>
<td>Type</td>
<td>Storage 1</td>
<td>Storage 2</td>
</tr>
<tr>
<td>Type A
<br>new line</td>
<td>10%</td>
<td>40%</td>
</tr>
<tr>
<td>Type B</td>
<td>90%</td>
<td>60%</td>
</tr>
</table>

You can stop word-wrap with white-space: nowrap; although it stops honoring the width element.
tr td:nth-child(1){
width:20px;
color:red;
white-space: nowrap;
}
<table>
<tr>
<td>Type</td>
<td>Storage 1</td>
<td>Storage 2</td>
</tr>
<tr>
<td>Type A</td>
<td>10%</td>
<td>40%</td>
</tr>
<tr>
<td>Type B</td>
<td>90%</td>
<td>60%</td>
</tr>
<table>

I'm assuming, you have a good reason for having tables within table. Then your problem is your semantics. You are not outputting the 'Type B', '90%' and '60%' on the same rows of the big table. Your sub-tables can either be aligned by vertical-align as blocks or you need to rework your big table semantics to something like this.
<table class="big">
<tr>
<td>Type</td>
<td>Storage 1</td>
<td>Storage 2</td>
</tr>
<tr>
<td>
<table class="small">
<tr>
<td>Type A Lorem ipsum</td>
</tr>
</table>
</td>
<td>
<table class="small">
<tr>
<td>10%</td>
</tr>
</table>
</td>
<td>
<table class="small">
<tr>
<td>40%</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table class="small">
<tr>
<td>Type B</td>
</tr>
</table>
</td>
<td>
<table class="small">
<tr>
<td>90%</td>
</tr>
</table>
</td>
<td>
<table class="small">
<tr>
<td>60%</td>
</tr>
</table>
</td>
</tr>
<table>

HTML Table not displaying properly

Hey guys I was creating this table table recently in HTML.
image:http://imgur.com/wPXCwrd
The table (shown in image) created perfectly but a weird blank row was created (marked red in image). When I tried to delete that code the entire cells below the QUESTIONS row gets shifted (image link:http://imgur.com/jBfmNGV).
How do I remove that blank cell after MEN cell?
CODE:
<!DOCTYPE html>
<html>
<body>
<table align="left" border="1" cellpadding="3" cellspacing="3">
<tbody>
<tr>
<td colspan="5">QUESTIONAIRE RESULTS</td>
</tr>
<tr>
<td rowspan="3">QUESTIONS</td>
<td colspan="2" rowspan="2">WOMEN</td>
<td colspan="2" rowspan="2">MEN</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td>YES</td>
<td>NO</td>
<td>YES</td>
<td>NO</td>
</tr>
<tr>
<td>Question 1</td>
<td>42%</td>
<td>58%</td>
<td>61%</td>
<td>39%</td>
</tr>
<tr>
<td>Question 2</td>
<td>53%</td>
<td>47%</td>
<td>69%</td>
<td>31%</td>
</tr>
<tr>
<td>Question 3</td>
<td>26%</td>
<td>74%</td>
<td>51%</td>
<td>49%</td>
</tr>
<tr>
<td>Question 4</td>
<td>40%</td>
<td>60%</td>
<td>60%</td>
<td>40%</td>
</tr>
</tbody>
</table>
</body>
</html>

Just remove the :
<td> </td>
so your final code will be :
<!DOCTYPE html>
<html>
<body>
<table align="left" border="1" cellpadding="3" cellspacing="3">
<tbody>
<tr>
<td colspan="5">QUESTIONAIRE RESULTS</td>
</tr>
<tr>
<td rowspan="3">QUESTIONS</td>
<td colspan="2" rowspan="2">WOMEN</td>
<td colspan="2" rowspan="2">MEN</td>
</tr>
<tr>
</tr>
<tr>
<td>YES</td>
<td>NO</td>
<td>YES</td>
<td>NO</td>
</tr>
<tr>
<td>Question 1</td>
<td>42%</td>
<td>58%</td>
<td>61%</td>
<td>39%</td>
</tr>
<tr>
<td>Question 2</td>
<td>53%</td>
<td>47%</td>
<td>69%</td>
<td>31%</td>
</tr>
<tr>
<td>Question 3</td>
<td>26%</td>
<td>74%</td>
<td>51%</td>
<td>49%</td>
</tr>
<tr>
<td>Question 4</td>
<td>40%</td>
<td>60%</td>
<td>60%</td>
<td>40%</td>
</tr>
</tbody>
</table>
</body>
</html>
Preview: https://jsfiddle.net/3q6n9v7k/

A more correct answer would be the changing the rowspan and colspan.
Instead of
<tr>
<td rowspan="3">QUESTIONS</td> //
<td colspan="2" rowspan="2">WOMEN</td>
<td colspan="2" rowspan="2">MEN</td>
</tr>
Do this
<tr>
<td rowspan="2">QUESTIONS</td>
<td colspan="2" rowspan="1">WOMEN</td>
<td colspan="2" rowspan="1">MEN</td>
</tr>
Also remove :
<tr>
<td> </td>
</tr>
check out Fiddle

How can I keep this table in a box?

If you run the snippet below you'll see a table that overflows on both axes. What I would like is to put this in a box so you can see the horizontal and vertical scroll bars all the time. This box should also scale with the page if the window's size is altered. Essentially this would be like looking at a Microsoft Excel spreadsheet where there is a consistent border between the window's edge and the table border and you can see the scroll bars all the time. How can I do this?
.sidebar {
position: fixed;
display: block;
overflow-x: hidden;
overflow-y: auto;
background-color: #aaa;
top: 0px;
bottom: 0px;
left: 0px;
width: 100px;
}
.main {
margin-left:100px;
}
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<body>
<div class="container">
<div class="sidebar">
<div>
<p>Fixed Sidebar</p>
</div>
</div>
<div class="main">
<div class="row">
<p>Some content above table</p>
</div>
<div class="table-responsive">
<table class="table table-bordered table-condensed">
<thead>
<tr>
<th>
Column 1
</th>
<th>
Column 2
</th>
<th>
Column 3
</th>
<th>
Column 4
</th>
<th>
Column 5
</th>
<th>
Column 6
</th>
</tr>
</thead>
<tbody>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
some really really really really long piece of data that's going to make my table overflow on the x-axis
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
<tr>
<td nowrap>
data 1
</td>
<td nowrap>
data 2
</td>
<td nowrap>
data 3
</td>
<td nowrap>
data 4
</td>
<td nowrap>
data 5
</td>
<td nowrap>
data 6
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</body>

is this what you want?
Add such style for your table-responsive class
.table-responsive {
overflow-x: scroll;
overflow-y: scroll;
width:100%;
height:100%;}
https://jsfiddle.net/puorqt13/

I ended up solving it as follows:
.sidebar {
position: fixed;
display: block;
overflow-x: hidden;
overflow-y: auto;
background-color: #aaa;
top: 0px;
bottom: 0px;
left: 0px;
width: 100px;
}
.main {
margin-left:100px;
}
.table-viewport {
position:absolute;
top: 50px;
bottom: 15px;
left: 115px;
right: 15px;
overflow-y: scroll;
border: 1px solid #aaa;
}
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<body>
<div class="container">
<div class="sidebar">
<div>
<p>Fixed Sidebar</p>
</div>
</div>
<div class="main">
<div class="row">
<p>Some content above table</p>
</div>
<div class="table-viewport">
<table class="table table-bordered table-condensed">
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
<th>Column 4</th>
<th>Column 5</th>
<th>Column 6</th>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>some really really really really long piece of data that's going to make my table overflow on the x-axis</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
<tr>
<td nowrap>data 1</td>
<td nowrap>data 2</td>
<td nowrap>data 3</td>
<td nowrap>data 4</td>
<td nowrap>data 5</td>
<td nowrap>data 6</td>
</tr>
</table>
</div>
</div>
</div>
</body>