How do I center a webpage I have created in Dreamweaver 8?

Question

I'm making a webpage in Dreamweaver that is 770 pixels wide using Macromedia Dreamweaver 8.

I want to make this webpage "centered" for all resolutions.. (i.e. there will be blank spots of an even size on the left and the right side of the screen when shown on a 1024-pixel-wide screen).

I've created a layout table, with layout cells in it. however, it is only letting me "autosize" one side, not both sides (if that makes anysense).

How do I make it blank spots of an even size on the left and the right side of the screen on any resolution above 770 pixles wide?

Answer 1

Do NOT remove & nbsp ; (remove spaces: non-breaking character) from empty cells just to make them disappear. Use proper CSS properties to do what you need. The & nbsp ; makes sure the table layout is correct and removing it can really mess up the layout in some browsers.



To center the table, you MUST set a width less than 100%. Then you can use the CSS property:



margin: 0 auto;



table {

width: XX%;

height: YYpx; /* optional */

margin: 0 auto;

border-collapse: collapse;

padding: Xpx;

}



If you use 770px for the table width, it will not be as flexible, but that should only be a problem when the browser window size gets less than or near the table's width. Percents allow some flexibility.



If you need the cells of a certain size and all cells will be the same size:



td {

width: XXpx;

height: YYpx;

}



If you have some cells different sizes, even if empty, you will have to set either a class or id for them.







Ron

Answer 2

take the & nbsp ; out of the cell's content. it will disappear.



for autosize, click on the cell or column you modified, and blank out the width property.

Answer 3

I've never made an entire website with tables, but this is how I'd centre it (without a table):



HTML...

all of your content

CSS...

#wrapper{

margin:0 auto;

width:770px;

}