How to Keep an HTML Table from Changing Width & Height
Most HTML tables are set up to change their dimensions in order to adjust to the size of a browser window. But if you are very particular about the size of your rows and cells, you will need to define your table's width and height in terms of pixels. Setting fixed pixel dimensions for your table will ensure that nothing bleeds over into the rest of your design.
Other People Are Reading
Instructions
-
-
1
Begin your table with the following code:
<table width="400" height="100">
You can substitute any value for the numbers 400 and 100.
-
2
Create a row by adding the <tr> tag. Your code should now look like this:
<table width="400" height="100">
<tr>
-
-
3
Create cells by adding the <td> tags. For example, if you were to add two cells that take up 40 and 60 percent of the table respectively, the code would be as follows:
<table width="400" height="100">
<tr>
<td width="40%" height="100%">Example 1</td>
<td width="60%" height="100%">Example 2</td>
The "Example" text is where the contents of the table must be entered. As you have already defined set dimensions, the percentages here will not grow or shrink beyond those boundaries.
-
4
Close up all your tags. This is your completed code:
<table width="400" height="100">
<tr>
<td width="40%" height="100%">Example 1</td>
<td width="60%" height="100%">Example 2</td>
</tr>
</table>
-
1
Resources
- Photo Credit Comstock/Comstock/Getty Images
