Sorry, but I have to ask a html question (website background image)

Factual Questions
1

I know GQ is reserved mostly for questions regarding the semi-cosmic ;), but I have a q.

I’m trying to get an image both stretched and fixed (so it doesn’t scroll with the text).

anyone have an idea?

Google hasn’t come up with anything useful.

thanks

2

Here’s a code for a watermark background. I don’t know about stretching it though.

3

I am 99% sure you can’t stretch a background image (unless you do it in Photoshop and post it as such…)

You can only tile or not tile it, and in some browsers you can decide how to tile it and position it.

You can fix it. See below.

Microsoft’s background attributes page (your non-IE browser may differ)

4

If you want an inline image (one marked up with an <img> tag) stretched, specify its width using a relative measurement like percent or em, like so:


<img src="mypic.gif" style="width: 50%;" />

Background images can’t be stretched. There’s a pretty good reason for that, since stretching a bitmapped image makes it ugly and pixellated. A better method for full-page backgrounds is to choose an image bigger than your largest anticipated page size (maybe 1600 x 1200 pixels), but which will also contain enough detail that users with smaller screen sizes can still see and make sense of it.

5

Better still, use CSS and thus avoid proprietary non-standard code used in non-standards-compliant browsers.

6

I second Duckster . The first two answers you received (both related to the bastard Microsoft-propietary abomination known as DHTML) are simply ghastly.

Let’s say you want a background image for your body.

Simple. Copy and paste the following into Notepad (or SimpleText, if you’re on a Mac), and save it as “mypage.html” (or whatever name you want followed by .html)

<html>
<head>
<title>Put title here</title>
<style type=“text/css”>
body {background: url("") fixed}
</style>
</head>
<body>
</body>
</html>

To keep life simple, put the image you want to use in the same folder as my example page here, and put the name of the image, complete with the letters after the dot, in the quotes where it says url(""). Voila!

Not all browsers will support the fixed background, and you will have to construct the image so as to stretch across the whole page yourself.

CSS Level 3, once formulated and adopted, will allow you to stretch a background image, but that’ several years down the road at this point.