Background positioning?

**starlingpacific** · 02-25-2005, 03:47 PM

Hi! Is there any way I can position my background using "position:absolute; left:190; top:0;" If you know anything, it would really help! Thanks.

**TheBigT** · 02-26-2005, 09:51 PM

Here you can use this... I find this very very very handy whenever you want to position a background or want to stretch it.

<html>
<head>
</head>
<body style="margin: 0px; padding: 0px;">
<div style="width: 100%; height: 100%; left: 0px; top: 0px; position: absolute; z-index: 0;">
<img src="BACKGROUND IMAGE HERE" style="width: 100%; height: 100%;">
</div>
<div style="z-index: 1; position: absolute;">
TYPE REST OF YOUR BODY HERE
</body>
</html>

Hope that helps you.

**mwinter** · 03-04-2005, 10:08 AM

Originally Posted by starlingpacific

Hi! Is there any way I can position my background using "position:absolute; left:190; top:0;"

The position property, coupled with box offsets (top, bottom, left, and right) is for positioning elements. The background-position property allows one to offset a background image within an element.

The property is defined as follows:

Code:

background-position: [percentage|length]{1,2}
                   | [[top|center|bottom] || [left|center|right]]]
                   | inherit;

In other words, a percentage or length, or two such values:

Code:

background-position: 20%;
background-position: 2px;
background-position: 5% 10%;
background-position: 1em 1em;

Note: In this form, when two values are present the first is the horizontal position. If only one, the horizontal position is assumed to be 50% and the given value is the vertical position. Lengths and percentages can be mixed. Negative positions are also acceptable.

or one or two keywords (in any order):

Code:

background-position: center;
background-position: right bottom;
background-position: top left;

Note: If only one keyword is specified, the other is assumed to be center. The keywords top and left represent 0% on their respective axes, whilst right and bottom represent 100%. The center keyword is equivalent to 50%.

The inherit keyword does, as always, explicitly specify that the property value should be inherited.

The background-position property can be specified as part of the shorthand background property.

Hope that helps,
Mike

Thread: Background positioning?

Thread Tools

Search Thread

Background positioning?

Bookmarks

Bookmarks

Posting Permissions