Hi.

 

I'm completely new to web design, and am trying to make a website. I have created the image in Photoshop, sliced it, and have imported it into Microsoft Web expression. I've connected to my hosting ftp, etc, so I can get the website online.

 

My problem is: How do I centre my website for when it displays in the browser, and is there anyway to stretch my image to fit on all resolutions? The Image is 1024x768, and I designed it in mind for having an Iframe in the middle, so there are borders on either side - just a simple red to white gradient, which I would like to stretch to either side - keeping my frame centred.

 

Help? .

 

Thanks

With regards to centering, simply add

 

margin: 0 auto;

 

to your wrapper/container/outter division (setting a width aswell).

 

For the background image, have you considered setting it as the main background and tiling it?

OK.

 

So I add that margin to the CSS, and set the width to my actual image width? Or am I way off here.

 

Also, do you mean have a seperate background image, and have it repeating? How would I do that.

 

Sorry, I realise these are stupid questions! Thanks.

Hi Mate

 

Best way to centre is to wrap your site in a containing Div and set a width for that div. Then set the margin css for that div to margin: 0px auto 0px auto; and that will align your site centre.

 

As for resizing the background image I am not sure. You would likely need some javascript to read the screen size which would then select a different background image to suit. But to be honest this is probably taking it a bit far.

 

Hope that helps in some way.

 

Jeb

 

 

Hi.

 

I'm completely new to web design, and am trying to make a website. I have created the image in Photoshop, sliced it, and have imported it into Microsoft Web expression. I've connected to my hosting ftp, etc, so I can get the website online.

 

My problem is: How do I centre my website for when it displays in the browser, and is there anyway to stretch my image to fit on all resolutions? The Image is 1024x768, and I designed it in mind for having an Iframe in the middle, so there are borders on either side - just a simple red to white gradient, which I would like to stretch to either side - keeping my frame centred.

 

Help? .

 

Thanks

OK.

 

So I add that margin to the CSS, and set the width to my actual image width? Or am I way off here.

 

 

There should be a "wrapper" (<div id="wrapper">) or "container" DIV around all your content in the HTML. You need to then reference this in the CSS like this:

 

#wrapper {

margin: 0 auto;

width: 960px;

}

 

(The '960' value depends on how much width you want to give your content, but 960 is a good standard and what I usually go with)

 

Sorry, I realise these are stupid questions! Thanks.

 

No such thing, everyone starts somewhere

Thanks guys, Im redoing things in photoshop atm, but will try this tomorrow and let you know.

No such thing, everyone starts somewhere

 

Well said that man

Thanks guys, I changed the gradient background to plain white so need to fiddle with that anymore . And got the centre to work!