• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 385
  • Last Modified:

How can I center a table vertically and horizonatally in Dreamweaver 8?


I am new to writing web design and I am having trouble making a table centered in the screen.  I have a table that is 1 x 1 and is 100% both height and width.  Inside of the table I have an image and have it centered in the table horizontally, but I am not sure on how to make it center vertically.  Any help is greatly appreciated.

Thank you.
  • 2
1 Solution
Jason C. LevineNo oneCommented:
Hi ryanbass,

Centering things vertically is a non-trivial undertaking and the exact method depends a bit on your existing code.

Can we see a link to the page, please?
ryanbassAuthor Commented:
Here is the code.  I am only working on the website locally right now.  I hope this will work.

Thanks for your help.
<!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">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
    <td valign="middle"><div align="center"><img src="Images/ETLogoOnly.gif" width="303" height="374" alt="ET Video, INC" /></div></td>

Open in new window

Does your table actually stretch to 100% height? That's usually the challenge. If you've got that covered, you can use CSS to position the image. Relative positioning at 50% will put the top edge in the center, so compensate by subtracting a margin of 1/2 the image's height. E.G. If you have an image 100px high, you need a margin of -50px, as below:
img {position: relative; top: 50%; margin-top: -50px;}
ryanbassAuthor Commented:
Sorry for the delay, but everything worked great.  Thanks for your help.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now