Closed Thread Icon

Topic awaiting preservation: Background Image Pages that link to <a href="https://ozoneasylum.com/backlink?for=7826" title="Pages that link to Topic awaiting preservation: Background Image" rel="nofollow" >Topic awaiting preservation: Background Image\

 
Author Thread
KARN
Bipolar (III) Inmate

From: North Bay, Ontario, CA
Insane since: Apr 2001

posted posted 09-08-2001 05:29

I was wondering is there a way to put a picture in the background without repeating (i mean just once) and at a certain place like top right, top left, bottom right... etc...?

::K::A::R::N::

bitdamaged
Maniac (V) Mad Scientist

From: 100101010011 <-- right about here
Insane since: Mar 2000

posted posted 09-08-2001 06:00

This is supposed to work with NN4 and IE 4
body {
background-repeat: no-repeat;
}

If you want placement you can use a DIV with a z-index of 0 and position it absolutely



:[ Computers let you make more mistakes faster than any other invention in human history, with the possible exceptions of handguns and tequila. ]:

Emperor
Maniac (V) Mad Scientist with Finglongers

From: Cell 53, East Wing
Insane since: Jul 2001

posted posted 09-08-2001 15:47

Just off the top of my head (so an odd error may have crept in):

body {
background: url ("whatever.jpg");
background-position: top right;
background-repeat: none;
}

Emps

Emperor
Maniac (V) Mad Scientist with Finglongers

From: Cell 53, East Wing
Insane since: Jul 2001

posted posted 09-08-2001 15:52

For details of what you can do in CSS2 compliant browsers see the specs (you can place the background pretty precisely and if you like put all the declarations into one line - although I prefer to do things long hand as I find it easier when I come back to edit things):
http://www.w3.org/TR/REC-CSS2/colors.html#background-properties

And bitdamaged is right it is no-repeat not none as I put (how I missed it as it was sitting there staring at me I don't know).

Emps

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted posted 09-08-2001 20:13

You can specify this all at once like this, also:

background: #000 url(bgimg.jpg) center no-repeat;

("center" will center the image on the page.)

Note that NN 4.x will only understand the CSS background properties if you specify them like this, I think.

KARN
Bipolar (III) Inmate

From: North Bay, Ontario, CA
Insane since: Apr 2001

posted posted 09-08-2001 22:41

thanx for the help...

::K::A::R::N::

KARN
Bipolar (III) Inmate

From: North Bay, Ontario, CA
Insane since: Apr 2001

posted posted 09-30-2001 06:08

Okay, the one Emperor gave worked great but Is it actually possible to put two backgrounds at once with one repeating and on just stay in one position, I tried different ways but they only use the background I put last:

body { background: white url("Background-Squares.jpg"); background-repeat:repeat-y; background-position: center;}
body { background: white url("Bubble-Background.jpg"); background-position: 100% 100%; background-repeat:no-repeat; background-position: top left;}

i used this one and whatever i put last that's the only background image it shows. Anyone have a clue what to do?

::K::A::R::N::

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted posted 09-30-2001 07:04

A single HTML element can only have one background image, sorry. You'll have to do it differently, like with a real image tag, or with a layer that only contains the image, put behind the content.

KARN
Bipolar (III) Inmate

From: North Bay, Ontario, CA
Insane since: Apr 2001

posted posted 09-30-2001 19:42

I tried using a layer, but how do you move the layer behind the content?

::K::A::R::N::

VelociRaptor
Nervous Wreck (II) Inmate

From:
Insane since: Sep 2001

posted posted 09-30-2001 19:56

Not sure if i understood the question, but is this what you mean?

Z-INDEX="n"
ABOVE="layername"
BELOW="layername"

The background would have to be on it's own layer, no?
The only problem you have is when you use a plug-in, as far as i
know (and i don't know that much, just trying to help) a plug-in
always moves to the front (at least with NS 4.x layers)

InSiDeR
Maniac (V) Inmate

From: Oblivion
Insane since: Sep 2001

posted posted 10-01-2001 05:12

couldnt you just div align it to the spot you want it? im really not sure what you are going for.

bitdamaged
Maniac (V) Mad Scientist

From: 100101010011 <-- right about here
Insane since: Mar 2000

posted posted 10-01-2001 19:38

I think if you put the layer first in your HTML then most will render the content that comes after it on top. But thats kinda a hack and you are dependent on the browser to render it okay

What you want is the CSS z-index property.

This defines the z-axis of the page. so you could do something like this
<html>
<head>
<style>
#backgroundDIV {position: absolute; top:100; left: 200; z-index:1;}
#contentDIV{ position: absolute; top:100; left:200; z-index:10;}
</style>
</head>
<body>
<div id="backgroundDIV">
<img src="pathtobackgrouind.gif">
</div>
<div id="contentDIV">
blah blah blah blah blah blah blah blah blah blah blah blah blah blah blahblah blah blah blah blah blah blah blah blahblah blah blahblah blah blahblah blah blahblah blah blah
</div>
</body>
</html>



:[ Computers let you make more mistakes faster than any other invention in human history, with the possible exceptions of handguns and tequila. ]:

Sash
Paranoid (IV) Inmate

From: Canada, Toronto
Insane since: May 2000

posted posted 10-02-2001 01:19

In case of:

background: #000 url(bgimg.jpg) center no-repeat;

NN4 won't understand "center" and will place the image on the top - left.
Not thay I care about NN4 but might be interesting for somebody.





« BackwardsOnwards »

Show Forum Drop Down Menu