CSS Forum

**valdez** · 12-07-2005, 01:38 PM

where do I put the "class" in the table?

the table code is

<p>
<table cellspacing="0" width="100%" border="0">
<tr>
<td width="100%" valign="top" align="left">
A
<br />
B
</td>

</tr>
</table>
</p>

**praveen** · 12-07-2005, 01:43 PM

p>
<table cellspacing="0" width="100%" border="0" class="whatever">
<tr>
<td width="100%" valign="top" align="left">
A
<br />
B
</td>

</tr>
</table>
</p>

**valdez** · 12-07-2005, 02:05 PM

that's what I thought and I tried that and it still doesn't show the css for the table.

**funkdaddu** · 12-07-2005, 02:49 PM

what are the class's properties? is your CSS code right for a class? .classname { }

**praveen** · 12-07-2005, 02:56 PM

if u post ur css code as well we might be able to see whats the reason

**0beron** · 12-07-2005, 06:36 PM

The way I usually do tables is to assign a class to the table itself, and then add another css rule that determines the style of <td>s inside that class of table:

Code:

table.border { 
               border: ridge 2px orange;
               margin: 4px;
               padding: 0px;
}
.border td{
            border: ridge 2px orange;
            margin: 1px;
            padding: 5px;
}

That way all tds inside a table of class border get their style.

**madkad** · 12-07-2005, 06:43 PM

you can also do it this way

HTML Code:

<p>
<table cellspacing="0" width="100%" border="0">
<tr>
<td width="100%" valign="top" align="left" class="whatever">
A
<br />
B
</td>
</tr>
</table>
</p>

you will probly find that one will work ok for text cell color row color etc etc.

**0beron** · 12-07-2005, 11:01 PM

Yeah you can assign the class to the tds individually, but if its a big table it becomes an absolute pain to type class="whatever" every time. Even if the HTML is dynamically generated, you get cleaner HTML source by using CSS to do the nesting for you.

**Mooofasa** · 12-08-2005, 03:51 AM

Personally, I don't use tables, but I know about them.

Make sure that you have linked your HTML file to your CSS properly.

HTML Code:

<link rel="stylesheet" type="text/css" href="./whatever.css">

**valdez** · 12-08-2005, 02:41 PM

I figured it out. I enclosed the table with the paragraph tag.
my code was:

<table>
<tr><td>something</td></tr>
</table>

I simply surrounded it with the paragraph tag

<p class="something">
<table>...</table>
</p>

thanks. and I also switched to a more css based layout
again thanks

**praveen** · 12-08-2005, 02:45 PM

that is an improper way to do it.

different browsers will interpret is differently and it will produce undesirable results.

what you have done is assign a paragraph element a class and not for the table.

to assign class to table u need to do it the way mentioned above.

maybe do a read about the css class and stuff before u decide to change everything arnd.

if u want the css effect on "something" you can do it this way

<td class> something</td>

ur choice if u want to do it this way or your "figured out" way..

**funkdaddu** · 12-08-2005, 03:08 PM

Here is an example of the proper way to do it:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<title>Untitled Page</title>
		<style type="text/css" media="screen">
			<!--
.myclass {
	border: dashed 3px #9b0000
	}

td {
	background-color: #f2ebd8
	}

-->
		</style>
	</head>

	<body bgcolor="#ffffff">
		<table class="myclass" width="180" border="0" cellspacing="2" cellpadding="0">
			<tr>
				<td>1</td>
				<td>2</td>
				<td>3</td>
			</tr>
			<tr>
				<td>4</td>
				<td>5</td>
				<td>6</td>
			</tr>
			<tr>
				<td>7</td>
				<td>8</td>
				<td>9</td>
			</tr>
		</table>
	</body>

</html>

**0beron** · 12-08-2005, 08:13 PM

That gives all the tds a background, regardless of the class of table they are in. If you make a .myclass td {} rule then you can get the right result with a myclass table, but still put a table with a different class or no class in the same document without the td class affecting it. (Or with a different td class affecting it, eg you can add a .myclass2{} and a .myclass2 td {} and they won't then clash)

**funkdaddu** · 12-08-2005, 10:56 PM

Yup, i though he was just asking about just styling the table, so I didn't think much when I threw that td style in.