...

View Full Version : Background image and screen size problem



johnnyk
10-29-2010, 04:55 PM
I'd be so apreciative if someone could point me in the right direction as Ive been ill and have missed tutorials and have a submission deadline fast approaching.
I want the background image to fill the screen but am I right in thinking this is not such a good idea? How can I get rid of the white both on sides and the bottom of the page. I intend to centre all the content on the page but this is also proving to be difficult.
Thanks in advance.

teedoff
10-29-2010, 05:00 PM
Is that a background image you created? Also is it set as the background on the body tag in your stylesheet? You can tile an image and set it as the background of the body.

johnnyk
10-29-2010, 05:06 PM
Yes I created a background image, 990px x 700px which is in the body tag.. It is unfortunatly not tilable as edges are darker than the interior.

teedoff
10-29-2010, 05:14 PM
Here (http://www.quackit.com/html/codes/html_stretch_background_image.cfm)is an article I found. Might help.

johnnyk
10-29-2010, 05:53 PM
Thanks, I gave it a shot but it seemed to mess things up a bit. I think it would be better to centre the image and have a background colour for the surrounding edges but Im not sure how to approach this as Ive already set a background image?

teedoff
10-29-2010, 06:09 PM
Again, to do this you could style the <body> tag with a background color of blue to match the image. Then have a div named wrapper around your code starting inside the body tag and ending before the closing body tag and then in your style sheet give the wrapper div an background image.

So it would be


<html>
<body>
<div id="wrapper">

all page content goes here

</div>
</body>
</html>

Then the styles would look something like this:



body {
background-color: whatever color comes close;
}

#wrapper {
background-image:url(imagefilepath.jpg)}

Major Payne
10-30-2010, 06:56 AM
Maybe this...

Background to Fit Screen II: http://paynelessdesigns.pastebin.com/f760990b
http://www.cssplay.co.uk/layouts/background
http://www.scriptdungeon.com/freejavascript/freescripts1284
http://css-tricks.com/perfect-full-page-background-image/



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum