CSS Table Style won't apply

Shadows1990

Shadows1990

Shadows1990

Associate
Joined
22 Jan 2008
Posts
1,311
Location
King's Lynn, Norfolk
Hi, I'm using XHTML, using CSS to define the attributes of a table.

Here is my CSS for the table:
Code: 
table.navigation
{
	table-layout: automatic;
	border-color: grey;
	border-style: dashed;
	border-width: thick;
}

And here is the code I've used to use it:

Code: 
	<table class="navigation">
		<tr>
			<td>
				<a href="index.html"> Home </a>
			</td>
		</tr>
		<tr>
			<td>
				<a href="processors/processorguide.html"> Processors </a>
			</td>
		</tr>
		<tr>
			<td>
				<a href="processors/single-core.html"> Single-Core </a>
			</td>
		</tr>
	</table>

I know the link to the style sheet works, as I have tested it with another class.

Anybody have a clue what's wrong with the code?
 
it's working ok here. What is it doing, and what are you expecting?

20090214-qughjejb6iny46179ct6i5g31h.png


width:

Code: 
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <style type="text/css">
table.navigation
{
	table-layout: automatic;
	border-color: grey;
	border-style: dashed;
	border-width: thick;
}    
    </style>
    </head>
    <body>
    <table class="navigation">
		<tr>
			<td>
				<a href="index.html"> Home </a>
			</td>
		</tr>
		<tr>
			<td>
				<a href="processors/processorguide.html"> Processors </a>
			</td>
		</tr>
		<tr>
			<td>
				<a href="processors/single-core.html"> Single-Core </a>
			</td>
		</tr>
	</table>

    </body>
</html>
 
Last edited:
shouldn't be. post up your html and I'll have a look, see if I can see it. What browser are you using?
 
Here's the HTML code:

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

<html>

  <head>
    <title>This is a test website</title>
	<link href="styles.css" rel=stylesheet type="text/css"> </link>
  </head>

  <body>

	<table class="navigation">
		<tr>
			<td>
				<a href="index.html"> Home </a>
			</td>
		</tr>
		<tr>
			<td>
				<a href="processors/processorguide.html"> Processors </a>
			</td>
		</tr>
		<tr>
			<td>
				<a href="processors/single-core.html"> Single-Core </a>
			</td>
		</tr>
	</table>
		
  </body>

</html>

And here's the external CSS, named styles.css:

Code: 
a.link
{
	color: black;
	text-decoration: no underline;
	font-family: tahoma;
	font-size: 10pt;
td.normallink
{
	color: black;
	font-family: tahoma;
	font-size: 10pt;
	font-weight: bold;
}
td.sublink
{
	color: black;
	font-size: 8pt;
	font-family: tahoma;
}
table.navigation
{
	table-layout: automatic;
	border-color: grey;
	border-style: dashed;
	border-width: thick;
}
 
You haven't closed off your a.link declaration. Works here if you do that.

Couple of other pointers.

*The <link/> tag is self closing.
*You have 2 opening <html> tags (delete the one without the xmlns attribute)
 
You must log in or register to reply here.
Back
Top Bottom