howrseinfo.com

  • Full Screen
  • Wide Screen
  • Narrow Screen
  • Increase font size
  • Default font size
  • Decrease font size

Different table formats

E-mail Print PDF

Different table formats

Choose which table layout you like, highlight the code to copy, right click then copy (or Control C) go to your profile box, change the edit mode to HTML mode and right click and paste (or Control V) at the top of the box, click the save my presentation button to save your layout. These layouts have colors and borders to show you various options available. You should now be able to change the background color, add or delete borders and customize these layouts to your requirements.

Different table formats and their HTML code

Title text/pictures
text/pictures text/pictures

<table width="550" bgcolor="#66FFFF" border="2" align="center" cellpadding="5" cellspacing="5">
<tr>
<td bgcolor="#CCFFFF">Title</td>
<td bgcolor="#CCFFFF">text/pictures</td>
</tr>
<tr>
<td>text/pictures</td>
<td>text/pictures</td>
</tr>
</table>

text/pictures text/pictures
text/pictures text/pictures
<table width="550" border="0" align="center" cellpadding="5" cellspacing="5" bgcolor="#0000FF">
<tr>
<td bgcolor="#FFFFFF">text/pictures</td>
<td bgcolor="#99CCFF">text/pictures</td>
</tr>
<tr>
<td>text/pictures</td>
td>text/pictures</td>
</tr>
</table>

Picture
The cells have been merged in the top row

Text........ More text..........
<table width="550" bgcolor="#FF99FF"border="2" align="center" cellpadding="5" cellspacing="5">
<tr>
<td colspan="2" bgcolor="#9966FF"><div align="center"> <p>Picture<br /> The cells have been merged in the top row </p> </div></td>
</tr>
<tr>
<td>Text........</td>
<td>More text.......... </td>
</tr>
</table>
rows have been merged text/pictures
text/pictures
<table width="550" border="0" align="center" cellpadding="5" cellspacing="5" bgcolor="#0000FF">
<tr>
<td rowspan="2" bgcolor="#FFFFFF">rows have been merged </td>
<td bgcolor="#99CCFF">text/pictures</td>
</tr>
<tr>
<td bgcolor="#99CCFF">text/pictures</td>
</tr>
</table>
rows have been merged text/pictures
text/pictures
columns have been merged
<table width="550" border="0" align="center" cellpadding="5" cellspacing="5" bgcolor="#9999FF">
<tr>
<td rowspan="2" bgcolor="#FFFFFF">rows have been merged </td>
<td bgcolor="#99CCFF">text/pictures</td>
</tr>
<tr>
<td bgcolor="#99CCFF">text/pictures</td>
</tr>
<tr>
<td colspan="2" bgcolor="#9900CC">columns have been merged </td>
</tr>
</table>


Practice putting some of these codes into your howrse profile, if you want to add rows or cells go back to the previous part of the tutorial . If all you see in your profile is html text delete that area and make sure you click the html edit mode button BEFORE you paste the html code. Pasting html code while in the normal edit mode will just put html coding into your layout. If you get confused with your tables it is often a good idea to draw your table out on a piece of paper then you can go through the html code line by line to make sure your rows and data cells all have the correct closing tags. You can change the colors using the internet safe colourchart.

Comments (0)Add Comment

Write comment

busy
You are here: Layout help intro Different table formats