CSS table not working

[Fmdpa]

I am trying to align 5 tabs using a CSS table. I added unique classes to the <table> and <td> elements because there is another table on this page that would be disturbed by the CSS style if i just made it format general <table> and <td> elements. Here's the CSS (the body is set to 1000px wide and 2000px high):

table.tabs,td.ttd{border:0px;}table.tabs{width:750px;height:325px;align:center;vertical-align:bottom;}td.ttd{height:75px;width:150px;vertical-align:bottom;}

<table>	<tr>		<td class="ttd">	<a href="index.html">	<img border="0" height="75" width="150" alt="Home" title="Home" src=	"GIF/active/home.gif" id="b1" onmouseover="changeImage('b1',	'GIF/active/home-mouseOver.gif')" onmouseout="changeImage('b1', 'GIF/active/home-mouseOut.gif')" />	</a>		<td class="ttd">					<a href="landscape.html">	<img border="0" height="75" width="150" alt="Landscape images" title="Landscape Images" src=	"GIF/land.gif" id="b2" onmouseover	="changeImage('b2',	'GIF/land-mouseOver.gif')" onmouseout="changeImage('b2', 'GIF/land-mouseOut.gif')" />	</a>			<td class="ttd">		<a href="wildlife.html">		<img border="0" height="75" width="150" alt="Wildlife images" title="Wildlife images" src="GIF/wildlife.gif" id="b3" 	onmouseover="changeImage('b3',	'GIF/wildlife-mouseOver.gif')" onmouseout="changeImage('b3', 'GIF/wildlife-mouseOut.gif')" />	</a>			<td class="ttd">		<a href="other.html">	<img border="0" height="75" width="150" alt="Misc. images" title="Other Images" src="GIF/other.gif" id="b4" 	onmouseover="changeImage('b4',	'GIF/other-mouseOver.gif')" onmouseout="changeImage('b4', 'GIF/other-mouseOut.gif')" />	</a>		<td class="ttd">			<a href="tutorials.html">			<img border="0" height="75" width="150" alt="tutorials" title="Photography Tutorials" src="GIF/tutorials.gif" id="b5" 	onmouseover="changeImage('b5',	'GIF/tutorials-mouseOver.gif')" onmouseout="changeImage('b5', 'GIF/tutorials-mouseOut.gif')" />	</a></tr></table>

Ignore the JS stuff. I was too lazy to delete it. This table is not doing anything at all. It is just throwing all of the tabs in the default top corner location. Any ideas?

[Synook]

If you want the table to be in the center of the page, you either need to set the text-alignment (CSS property text-align) on the parent, or set the table to have auto margins in the x-direction.Note that you should really be using a list for this.

[Fmdpa]

Oh, I forgot about text-align. By list, do you mean-http://www.w3schools.com/css/css_list.asp Expound, please?

[Synook]

I meant, instead of using the <table> element, which is for tabular information, use the <ul> element, with is for enumerated information, like your tabs.

[Fmdpa]

But can I horizontally align these tabs without bullets using <ul>?

[ShadowMage]

Yes. Change the list-style to get rid of the bullets, and use either float or display: inline to align them horizontally.