Log in to check your private messages 
Username: Password:   
  howtodoit.myfastforum.org
  Walkthough guides for myfreeforum phpbb 2 forums
Index  FAQ  Search  Memberlist  Usergroups  Profile

Text
Text
Friends
MYFF Support Forum
HOWTODOIT (PHPbb3)
portalogy
CGArts
ANNOUNCEMENTS
Complete List of templates Available
Please Read First Before Editing your template
Permissions
Admin Index
Sticky Articles
Latest Posts
Friends

Start | Stop
Tables
Jump to:  
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    howtodoit.myfastforum.org Forum Index » The Most common Question's Answered
Author Message
Please Register and Login to this forum to stop seeing this advertising.







Add Comment
Show Comments
Posted:

Symon
Guide Legend
Guide Legend



Joined: 11 Jun 2006
Posts: 911


Location: Berkshire,England
FLAGS
Add Comment
Show Comments
PostPosted: Wed Jul 05, 2006 8:28 pm  Reply with quote

First off you have to your allow these HTML tags in admin panel --general config-- allow HTML (also make sure html is on in your profile and any member that wishes to see the table)

table,tr,th,td

-------------------------------------------------------------------------------------
Table Tags
Tag Description
<table> Defines a table
<th> Defines a table header
<tr> Defines a table row
<td> Defines a table cell
<caption> Defines a table caption
<colgroup> Defines groups of table columns
<col> Defines the attribute values for one or more columns in a table
<thead> Defines a table head
<tbody> Defines a table body
<tfoot> Defines a table footer
=----------------------------------------------------------------------------------

TIP

To avoid the table being shown half way down the page make sure that there are no breaks in the code for example:

Insted of this
<table border="1">
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>

Make it like this

<table border="1"><tr><td>Row 1, cell 1</td><td>Row 1, cell 2</td></tr></table>

Tables
Tables are defined with the <table> tag. A table is divided into rows (with the <tr> tag), and each row is divided into data cells (with the <td> tag). The letters td stands for "table data," which is the content of a data cell. A data cell can contain text, images, lists, paragraphs, forms, horizontal rules, tables, etc.

Example 1

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

See below to see how they will look

--------------------------------------------------------------------------------

Tables and the Border Attribute
If you do not specify a border attribute the table will be displayed without any borders. Sometimes this can be useful, but most of the time, you want the borders to show.

To display a table with borders, you will have to use the border attribute:

Example 2

<table border="1">
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>

--------------------------------------------------------------------------------

Headings in a Table
Headings in a table are defined with the <th> tag.

Example 3

<table border="1">
<tr>
<th>Heading</th>
<th>Another Heading</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
--------------------------------------------------------------------------------

Empty Cells in a Table
Table cells with no content are not displayed very well in most browsers.

Example 4 a

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td></td>
</tr>
</table>

Note that the borders around the empty table cell are missing (NB! Mozilla Firefox displays the border).

To avoid this, add a non-breaking space (&nbsp;) to empty data cells, to make the borders visible:

Example 4 b

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>&nbsp;</td>
</tr>
</table>

<html>
<body>

-------------------------------------------------------------------------------------
This table has a caption,and a thick border:

Example 5

<table border="6">
<caption>My Caption</caption>
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>

</body>
</html>

--------------------------------------------------------------------------------

Cell that spans two columns:

Example 6

<table border="1">
<tr>
<th>Name</th>
<th colspan="2">Telephone</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>

Cell that spans two rows:

<table border="1">
<tr>
<th>First Name:</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">Telephone:</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>

-------------------------------------------------------------------------------
Tags inside a table

Example 7

<table border="1"><tr><td><p>This is a paragraph</p><p>This is another paragraph</p></td><td>This cell contains a table:<table border="1"><tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>This cell contains a list
<ul>
<li>apples</li>
<li>bananas</li>
<li>pineapples</li>
</ul>
</td>
<td>HELLO</td>
</tr>
</table>

--------------------------------------------------------------------------------

Without cellpadding:

Example 8

<table border="1">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>

With cellpadding:

<table border="1"
cellpadding="10">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>

-------------------------------------------------------------------------------

Without cellspacing:

Example 9

<table border="1">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>

With cellspacing:

<table border="1"
cellspacing="10">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>

--------------------------------------------------------------------------------

A background color:

Example 10

<table border="1"
bgcolor="red">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>

A background image:

<table border="1"
background=http://link to the image>
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>

-------------------------------------------------------------------------------

Cell backgrounds:

Example 11

<table border="1">
<tr>
<td bgcolor="red">First</td>
<td>Row</td>
</tr>
<tr>
<td
background=http://link to the image>
Second</td>
<td>Row</td>
</tr>
</table>

-------------------------------------------------------------------------------

Align the content in a table cell

Example 12

<table width="400" border="1">
<tr>
<th align="left">Money spent on....</th>
<th align="right">January</th>
<th align="right">February</th>
</tr>
<tr>
<td align="left">Clothes</td>
<td align="right">$241.10</td>
<td align="right">$50.20</td>
</tr>
<tr>
<td align="left">Make-Up</td>
<td align="right">$30.00</td>
<td align="right">$44.45</td>
</tr>
<tr>
<td align="left">Food</td>
<td align="right">$730.40</td>
<td align="right">$650.00</td>
</tr>
<tr>
<th align="left">Sum</th>
<th align="right">$1001.50</th>
<th align="right">$744.65</th>
</tr>
</table>


--------------------------------------------------------------------------------
Basic Notes - Useful Tips
The <thead>,<tbody> and <tfoot> elements are seldom used, because of bad browser support. Expect this to change in future versions of XHTML.
View user's profile Send private message Visit poster's website FACEBOOKSTEAM
Symon
Guide Legend
Guide Legend



Joined: 11 Jun 2006
Posts: 911


Location: Berkshire,England
FLAGS
Add Comment
Show Comments
PostPosted: Wed Jul 05, 2006 8:29 pm Reply with quote

Example 1

row 1, cell 1row 1, cell 2
row 2, cell 1row 2, cell 2


Example 2

Table with borders

Row 1, cell 1Row 1, cell 2


Example 3

Headings in a Table

HeadingAnother Heading
row 1, cell 1row 1, cell 2
row 2, cell 1row 2, cell 2


Example 4 a

Empty Cells in a Table

row 1, cell 1row 1, cell 2
row 2, cell 1


Example 4 b

row 1, cell 1row 1, cell 2
row 2, cell 1&nbsp;


Example 5

Table with a Caption

My Caption
100200300
400500600


Example 6

Cell that spans two columns:

NameTelephone
Bill Gates555 77 854555 77 855


Cell that spans two rows:

First Name:Bill Gates
Telephone:555 77 854
555 77 855


Example 7

Tags inside a table

This is a paragraph

This is another paragraph

This cell contains a table:
AB
CD
This cell contains a list
  • apples
  • bananas
  • pineapples
HELLO


Example 8

Without cellpadding:

FirstRow
SecondRow


With cellpadding:

FirstRow
SecondRow


Example 9

Without cellspacing:

FirstRow
SecondRow


With cellspacing:

FirstRow
SecondRow


Example 10

A background color:

FirstRow
SecondRow


A background image:

FirstRow
SecondRow


Example 11

Cell backgrounds:

FirstRow
SecondRow


Example 12

Align the content in a table cell

Money spent on....JanuaryFebruary
Clothes$241.10$50.20
Make-Up$30.00$44.45
Food$730.40$650.00
Sum$1001.50$744.65


View user's profile Send private message Visit poster's website FACEBOOKSTEAM
Display posts from previous:   
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    howtodoit.myfastforum.org Forum Index » The Most common Question's Answered


 
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum

HOWTODOIT was designed and built by Symon Field
Creator Of ☆ ☆ FunnyWorld
HOWTODOIT© Symon Field 2006,2007,2008

Powered by phpBB Group © 2001,2005.
 
Create your own free forum | Buy a domain to use with your forum