CSS Table Style won't apply

[Shadows1990]

Hi, I'm using XHTML, using CSS to define the attributes of a table.

Here is my CSS for the table:

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:

	<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?

 

[Sic]

it's working ok here. What is it doing, and what are you expecting?

width:

<!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>

 

[Shadows1990]

What you displayed, is what I was expecting.

However, it doesn't work with the external CSS.
Do you think that is my problem?

 

[Sic]

shouldn't be. post up your html and I'll have a look, see if I can see it. What browser are you using?

 

[Shadows1990]

Here's the HTML 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:

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;
}

 

[Sic]

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)

 

[Shadows1990]

Thanks very much Sic, that's solved it

oh, I've noted the other two points, thanks

 

[Sic]

heh, no worries - it's always something totally unrelated to what you're doing!

 

[HungryHippos]

forgetting to close a CSS entry has caught me out a few times too