HTML Medium Table Setup


In this tutorial I will show you 2 things. Please Note: This tutorial requires a lil bit of Basic HTML knowledge.

1:) How make a table body correctly
2:) How to make multiple things align

1st: First we need to open our table and table body. To do that simply add this to your document.

HTML Code
  1. <table>
  2. <tbody>


2nd: Then we need to open our <tr>, or our Table Row, to contain our object. We do this like this:

HTML Code
  1. <tr>


3rd: Now we need to open our <td>, or our table data, which is where we will put what we want. We do this by:

HTML Code
  1. <td>


Now to sum most of it up, you should have something like this now:

HTML Code
  1. <table>
  2. <tbody>
  3. <tr>
  4. <td>


Now just add something after the <td> tag, like so:

HTML Code
  1. <table>
  2. <tbody>
  3. <tr>
  4. <td>Test
  5. </tbody>


Then Close the data like this:

HTML Code
  1. <table>
  2. <tbody>
  3. <tr>
  4. <td>Test</td>
  5. </tbody>


Then Close the row, like this

HTML Code
  1. <table>
  2. <tbody>
  3. <tr>
  4. <td>Test</td>
  5. </tr>
  6. </tbody>


Then Close The Whole thing like this:

HTML Code
  1. <table>
  2. <tbody>
  3. <tr>
  4. <td>Test</td>
  5. </tr>
  6. </tbody>
  7. </table>


------2nd Part------

At the end of the 1st part you should of had something like this:

HTML Code
  1. <table>
  2. <tbody>
  3. <tr>
  4. <td>Test</td>
  5. </tr>
  6. </tbody>
  7. </table>


Now to make more then one thing show up beside each other you would simply do this:

HTML Code
  1. <table>
  2. <tbody>
  3. <tr>
  4. <td>Test</td>
  5. <td>Test 2</td>
  6. </tr>
  7. </tbody>
  8. </table>


Then if you would rather have one above the other, then you would do this:

HTML Code
  1. <table>
  2. <tbody>
  3. <tr>
  4. <td>Test</td>
  5. </tr>
  6. <tr>
  7. <td>Test 2</td>
  8. </tr>
  9. </tbody>
  10. </table>


To see what I have done with this simple code, go here:

https://www.lone-wolfs-cave.com/edchat/userpanel/shop/helmhelp.html
FtH8er's Avatar
Author:
Views:
2,081
Rating:
There are currently no comments for this tutorial, login or register to leave one.