How do you vertically align a table?

Question

I have a page that goes something like this:

(more td's and /td's)

some text

What I want to know is how to vertically align the table. I've tried using the valign and vertical-align attributes but that only vertically aligns the text in the table. I'm wanting the table itself. Any help would be greatly appreciated.

Answer 1

don't listen to that guy, valign is a td attribute, make sure you use the right value, (top, middle or bottom)



I also noticed in your code you open a before opening a witch is an error

@nbsp;

@nbsp;

Also never leave an empty cell, use "@nbsp;" without quote to ensure "What you see is what you get"



P.S. Replace the "@" of "@nbsp;" with "&" since yahoo remove html entitities and you would just see a space

Answer 2

or you can put align to left or right etc



OR using css







using id



in head pu this





or you can include this file

Answer 3

Are you using this as a nav? If so, you're coding way more than you need to. Look into HTML/CSS layouts.



Here's a simple nav using the HTML/CSS method:



HTML:

• Home



• About us



• Support



• Clients



• Contact

CSS:



/* TOP PANEL */

#topPan{width:700px; height:252px; position:relative; margin:0 auto;}

#topPan h1{width:311px; height:215px; /*background:url(images/header-img1.jpg) 0 0 no-repeat #FEEBB0;*/ color:#fff; text-indent:-2000px;}

#topPan img{width:700px; height:209px; position:absolute; top:0; left:0;}

#topPan ul{width:376px; height:32px; display:block; position:absolute; top:215px; right:0px; background:url(images/menu-bg.gif) 0 0 repeat-x #FF8714; color:#fff;}

#topPan ul li{float:left; display:block; width:75px; height:32px; background:url(images/menu-divider.gif) right top no-repeat;}

#topPan ul li span{display:block; width:73px; height:32px; background:url(images/menu-hover.gif) 50% 0 no-repeat; font:13px/32px "Trebuchet MS",Arial, Helvetica, sans-serif; font-weight:bold; text-align:center; text-decoration:none;}

#topPan ul li a{display:block; width:73px; height:32px; background:url(images/menu-bg.gif) 0 0 repeat-x #FF8714; color:#fff; font:13px/32px "Trebuchet MS",Arial, Helvetica, sans-serif; font-weight:bold; text-align:center; text-decoration:none;}

#topPan ul li a:hover{display:block; width:73px; background:url(images/menu-hover.gif) 50% 0 no-repeat;text-decoration:none; /*position:fixed;*/}

#topPan ul li.contact{display:block; width:75px; height:32px; background:url(images/menu-bg.gif) 0 0 repeat-x #FF8714; color:#fff; font:13px/32px "Trebuchet MS",Arial, Helvetica, sans-serif; font-weight:bold; text-align:center; text-decoration:none;}

#topPan ul li.contact:hover{display:block; width:75px; background:url(images/menu-hover.gif) 50% 0 no-repeat;text-decoration:none; /*position:fixed;*/}



/* /TOP PANEL */



Yes, it is a lot, but it will save you hours of coding in the long run and it is easier to modify, instead of having to go through and wade through a bunch of tables.