HTML Lessons  

  1. HTML Introduction

  2. HTML Tags

  3. HTML Page Structure

  4. HTML Backgrounds

  5. HTML Formatting Text

  6. HTML Formatting Fonts

  7. HTML Headings

  8. HTML Entities

  9. HTML Line Breaks

  10. HTML Lists

  11. HTML HR- Horizontal Rule

  12. HTML Images

  13. HTML Links

  14. Table Introduction

  15. Table Rows & Columns

  16. Table Width

  17. Table Alignment

  18. Table Border Color

  19. Table Background Color

  20. Table Background Image

  21. Cell Alignment

  22. Cell Padding

  23. Cell Spacing

  24. Cell Spanning

 

Changing the width of a table

Perhaps you wouldn't like the table to take up the whole width of the browser window.  Say you only wanted to take up 50% of the browser window.

To make things a little less crowed let's go back to our first  table example and let's add the width attribute.

<body><table width="50%" border="1">
<tr>
<td>Text1 </td>
</tr>
</table></body>

The result would be:
Text1

As you can see the table has now reduced in half and only takes up half the width of the browser. Keep in mind that by using a percent value the table will take up 50% of the browser window.  Therefore it may look very different in two different browsers. 

To make things more exact you can measure the width of the table by using pixels.  To do this, simply leave out the percent sign, like so:

<body><table width="100" border="1">
<tr>
<td>Text1 </td>
</tr>
</table></body>

Now the table will look like this:

Text1

You can also set the height of a table, like so:

<body><table width="100" height="100" border="1">
<tr>
<td>Text1 </td>
</tr>
</table></body>

Now the table will look like this:

Text1

Next Lesson

© Copyright Studio6000 2006. All rights Reserved.