PDA

View Full Version : Background image not positioned right!!!

Combat Babe
05-02-2005, 03:10 AM
I'm doing a school project that requires a webpage, and I've never really done what I'm trying to do before. I have to have this done by tonight, so any quick help would be really helpful. Here is the page: http://www.erstwhilemoments.belike.net/Tiger Project/index.htm See the leaves? They aren't aligning properly, and I don't know how to fix it. Here is the css I have:

body {
background-image: url('tigerbg.gif');
bacground-position: 370px 0px;
background-repeat: repeat-y;
font family: Garamond, Book Antiqua, Arial;
font-size: 10pt;
color: #000000;
background-color: #cc6600;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
}

a {
font-weight: bold;
color: #ffffff;
text-decoration: none;}

a:hover {
font-weight: bold;
color: #000000;
font-size: 11pt;
text-decoration: none;
cursor: help; }

a:visited{
font-weight: bold;
color: #ffffff;
text-decoration: none;
cursor: help; }

.head {
letter-spacing: 2px;
text-align: center;
font-weight: bold;
padding: 1px;
color: #ffffff;
border: 0px}

.con {
padding: 3px; }




How do I make it work???? Any help is greatly appreciated.
Alcy
05-02-2005, 03:37 AM
It's one of those trial and error things... unless you want to measure :stickout:

Try this for your background:
background: url(tigerbg.gif) 0px 110px repeat-y;


In IE, there's a gap between tigerhead1.jpg and tigerhead2.jpg because they're on different lines.
Combat Babe
05-02-2005, 03:47 AM
The gap is fixed. (I've got a copy on my computer that I'm working with.) That didn't fix the background, it simply made it disapear....
Paysan Barbare
05-02-2005, 11:04 PM
hello,
I'll try to align your graphics; this is what I change:
in the css
HTML,BODY {
MARGIN: 0px;FONT-SIZE: 10pt; COLOR: #000000; BACKGROUND-COLOR: #cc6600;position:absolute;
}

.bg{
BACKGROUND-IMAGE: url(tigerbg.gif); BACKGROUND-REPEAT: repeat-y;position: absolute;height:100%;top:-20px;
}
in the html page:
<BODY><div class="bg"><A name=top></A>
<DIV
style="WIDTH: 750px; HEIGHT: 370px;margin-top:20px;"><IMG
src="Tigers_fichiers/tigerhead1.jpg" width=750 heigth="370px"><IMG
src="Tigers_fichiers/tigerhead2.jpg" width=750 heigth="370px"> </DIV>
<DIV style="margin-left: 86px; WIDTH: 585px;">

I hope It's this you want!
bye
pb&j
05-03-2005, 08:06 AM
<IMG
src="Tigers_fichiers/tigerhead1.jpg" width="750" heigth="370px"><IMG
src="Tigers_fichiers/tigerhead2.jpg" width="750" heigth="370px">
just fyi...
blue parts should be added, red parts should be deleted.
Paysan Barbare
05-03-2005, 08:16 AM
but I don't take the time to correct all the html and css, because I haven't many time, and they are a lot of ambiguous code: for example many <balise style:"tralala" instead of put this in the css, or a lot of forgotten quotes, and a lot of <div></div> and I've just noticed that what I do is only running on IE so sorry... However, I think Combat Babe can find how to align correctly your graphics with what I do...