Tables

stef_ios · **Posted:** Tue Feb 06, 2007 8:18 pm

I am writing in XHTML and I do not know how to write code for a table. It is three rows and three columns, and there is writing in each cell. If someone could help get me started that would be great. Thanks! Very Happy

P.S. I am a noobie at XHTML and even though I know HTML, I have never done a table before. Confused

Amailer · **Posted:** Tue Feb 06, 2007 8:42 pm

http://www.w3schools.com/tags/tag_table.asp

Check w3schools Very Happy

stef_ios · **Posted:** Wed Feb 07, 2007 2:24 pm

Thanks!! That really did help. I used w3schools before, but i couldn't find that page. Confused

Thanks!

stef_ios · **Posted:** Wed Feb 07, 2007 3:01 pm

Ok, another question now. Here is my code. Now the problem I am running into is that I cannot get the cells spaced out. This is my code.

code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
<title>Mr. Henrich's Class Schedule</title>
</head>

<body>

<h4 align="center">Mr. Henrich's Class Schedule</h4>

<table border="1" bgcolor="#DA70D6" cellpadding="10">
<tr>
<th>Class</th>
<th>Room</th>
<th>Time</th>
</tr>
<tr>
<td align="center">GLC201-01</td>
<td align="left">1st Floor, Room 101</td>
<td align="left">8:25 AM to 9:45 AM</td>
</tr>
<tr>
<td align="center">ICE4M1-01</td>
<td align="left">2nd Floor, Room 224</td>
<td align="left">12:10 PM to 1:25 PM</td>
</tr>
<tr>
<td align="center">ICS4M1-01</td>
<td align="left">2nd Floor, Room 224</td>
<td align="left">12:10 PM to 1:25 PM</td>
</tr>
<tr>
<td align="center">ICE3M1-01</td>
<td align="left">2nd Floor, Room 224</td>
<td align="left">1:25 PM to 2:45 PM</td>
</tr>
</table>

</body>

</html>

I don't know what the code looks like to make the cells longer horizontally. They are stubby little boxes right now. Also, I do not know how to get the cell borders to have their own colour. The colour should be #000000 for the text and #FF1493 for the border. I do not know how to chang ethe colour of the border though. I cannot find the code for those two parts either, so any help I can get would be great! Thanks!

Amailer · **Posted:** Wed Feb 07, 2007 4:28 pm

You CAN just do width="x%" for each <td>, but then it would come up as invalid XHTML. So, you have to use CSS

You can make a simple CSS id for TD width like:

css:

#width10 {
width: 10px;
}

and then give that TD that id

HTML:

Or line in the way they show at w3.org Very Happy

**EDIT** Wow, whats with me and the URL bbcode oO

stef_ios · **Posted:** Wed Feb 07, 2007 4:43 pm

Where in the code do I put that first bit of code? I'm not too sure. It's saying dialogue error.

Amailer · **Posted:** Wed Feb 07, 2007 4:51 pm

You can do it this way, in your <head></head> tags put:

HTML:

Or you could include a .css file using:

HTML:

In that (my.css) you just put

css:

#width10 {
width: 10px;
}

stef_ios · **Posted:** Wed Feb 07, 2007 5:18 pm

Another question now. So the background colour is perfect. But now I need to make the border colour of the cells different. The bottom and right borders of each cell are red, and the top and left borders are black. How do I do this, because w3schools doesn't say. Thanks.

Amailer · **Posted:** Wed Feb 07, 2007 5:44 pm

With CSS use background-color: #code;

stef_ios · **Posted:** Wed Feb 07, 2007 5:58 pm

How exactly do I do that? I really suck at this stuff Confused

Amailer · **Posted:** Wed Feb 07, 2007 6:15 pm

Look up CSS background-color on google Very Happy

For background images, background-image:

stef_ios · **Posted:** Thu Feb 08, 2007 5:13 pm

I have another table now. For this one I can't seem to get it to pass the validation at http://validator.w3.org. Here is the code.

code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
<title>My Very Own Table!</title>

<style type="text/css" media="screen">
#width950 {
width: 950px;
border-style: solid;
border-color: #FFFFFF;
color: #FFFFFF;
}

</style>

</head>

<body>

<h3 align="center"><u>Immigration and Emigration (1981-2001 Censuses)</u></h3>

<table border="1" bgcolor="#000000" id="width950">
<tr>
<th><b>Year</b><a href="http://www40.statcan.ca/l01/cst01/demo03.htm" target="_blank">
<img border="0" src="calendar.gif" width="50" height="50" alt="calendar"></th>
<th><b>Immigration</b><a href="http://www.cic.gc.ca/" target="_blank">
<img border="0" src="immigration.gif" width="50" height="50" alt="immigration"></th>
<th><b>Emigration</b><a href="http://en.wikipedia.org/wiki/Emmigration" target="_blank">
<img border="0" src="emigration.gif" width="50" height="50" alt="emigration"></th>
</tr>
<tr>
<td align="center">1981-1986</td>
<td align="center">678</td>
<td align="center">278</td>
</tr>
<tr>
<td align="center">1986-1991</td>
<td align="center">1,164</td>
<td align="center">213</td>
</tr>
<tr>
<td align="center">1991-1996</td>
<td align="center">1,118</td>
<td align="center">338</td>
</tr>
<tr>
<td align="center">1996-2001</td>
<td align="center">1,217</td>
<td align="center">376</td>
</tr>
</table>

</body>

</html>

I do not understand what the validator is telling me. Can someone please explain?

rdrake · **Posted:** Thu Feb 08, 2007 5:54 pm

You must close all of your tags, like so:

code:

Notice how I placed the " />" at the end of the image tag, and added the < / a > tag after the end of your image tag? It should now be valid, though I did not test it yet.

Amailer · **Posted:** Thu Feb 08, 2007 9:26 pm

Also I noticed your validating by xhtml1-transitional, so that would allow you to use the bgcolor value (if Im correct, not 100% sure) in your table tags:

code:

but if it was strict, that wouldn't be allowed (hm, I always thought you were using strict, sorry xD no need for that css really if you aren't Razz

you could have just put it right into the html)

stef_ios · **Posted:** Fri Feb 09, 2007 3:59 pm

Thanks for all the help!! It passed the validation!! Yay! Thanks alot!!

	Computer Science Canada Programming C, C++, Java, PHP, Ruby, Turing, VB Username: Password: Register
Wiki Blog Search Turing Chat Room Members