Centering webpages

Hi all,

I'm currently putting together a website:

www.simonspetportraits.co.uk

I'm not sure if there is a way of centering it though.

In Dreamweaver I created layers to put the images and text in.

When I tried creating an external css style sheet which was applied to the body, only the navigation bar and banner were moved to the center, everything else stayed on the left hand side.

Does anyone know if it is possible to center everything?

Thanks alot.

 

If your page has one consistent width, i.e 800px or 100%.. then a simple fix is to put the whole thing in a wrap:

<div id="wrap">
EVERYTHING ELSE
</div>

Then inside the CSS you would specify

#wrap {
width: THE WIDTH OF YOUR SITE IN PX OR %;
margin: 0px auto; /*This Centers the Page*/
}

EDIT: I have just seen what you meant by layers and Dreamweaver. And Dreamweaver Rollovers. You are basically creating the site with Design view i guess then. This is not the best way to learn how to make websites, due to browser compatability issues, unessecary and bloated code, and not nessecarily effective or efficent.

Dependant upon your columns you should search for a CSS x column layout for a rough guide. As well as learning HTML and CSS along with tableless layouts. To be honest I learnt all of this off these forums, although i'm not an expert i've come a long way since layers in my opinion.

 

Since you're using DW's silly absolute positioning, in addition to WD's suggestion, you'll also need to add {position: relative;} to the #wrap selector so that its descendants will draw positioning reference from it instead of body.

cheers,

gary

 

I think you meant "steaming pile of rubbish scraped off adobe's boot", not "silly"

Javascripted mouseovers? Check.
Inlined presentation? Check.
Spacer .gif's? Check.
DIV 'layers' combined with a table? Check.
9k of of markup for 340 bytes of actual content? Check.

There is more of 1997 to this site than 2008, and is a wonderful example of all the reasons NOT to use dreamweaver, much less why I constantly say if that's a professional grade tool, I'm the next Mahātmā.

 

Hmm maybe there's a market out there to create a software that's more 2008, does not even include the use of layers, dissalows or provides errors on the use of deprecated tags and ensures CSS is used for presentational purpose! it can't be that hard and if it got rep with all the big developers it'd certaintly make some serious $$

 

Here's a simple technique for centering page layouts. It works on fixed width floated layouts.

Give the main page container a margin-left:50%;
Use position:relative and translate it left 1/2 of width.

#container{
position:relative;
float:left;
width:900px;
margin-left:50%;
left:-450px;
}

To center page containers that are fluid width add text-align:center to the body tag and then margin:0 auto and text-align-left to the page container.

To write good, tight HTML/CSS you'll have to dump all of the WYSIWYG editors and actually learn HTML/CSS. None of 'em work very well, and never have. I thank them for this as it has provided me many thousands of hours of gainful employment rewriting WYSIWYG code. In many cases I end up with 1/10th as much code and last month I did one where I ended up with 5% of the code. I use an good text editor, BBEdit.

If you're hiring your work done just create your layouts in InDesign, Photoshop or Illustrator and let an experienced coder write the HTML. It's faster, cheaper and more accurate than rewriting WYSIWYG code.