Background Question

[erum]

Hi,

I'm new to css. I'm trying to make a page layout where there is a left border and top border.

Now i've set the left border as a repeating pattern using this:
body {
background-color: #FBF9FA;
background-image: url(images/main/leftback.gif);
background-repeat: repeat-y;
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
color : #5A3657;
margin: 0px 0px 0px 0px;
padding:0;
}

Now the question is how do I get the top border to repeat as well? I can't have two body codes. I tried using a box:


.topleft {
background: #9966FF;
background-image: url(images/main/topback.gif);
padding : 0px;
margin: 0px;
border-width : 0px;
height: 71px;
width: 100%;
top: 0px;
left: 0px;
right: 0px;
}

This works fine in ie but in nn 4.72 it is placed a few pixels down from the top, starts to the right of the background image in the left bar and ends around 20 pixels before the right margin.



Second question is how do I get an image to display to the top right?

.endflower {
position: absolute;
left: auto;
right: 0px;
margin-right: 0px;
top: 0px;
width: 46px;
height: 71px;
}

works in ie but in nn 4.72 it stays to the top left. So I guess the right:0px does not work in nn 4.72. Any way around it?

[Fod]

but this in the body...

border-top: 1px solid #000000;
border-left: 1px solid #000000;

you can change the color.. an the pattern but i can't remember that the others were..

an for the image

position: absolute; top: 0; right: 0;

..this is how i THINK it goes....

[erum]

nope that doesn't work in nn4.72. The code works perfectly alright in nn7.1 when I use <div class="topleft"> but refuses to even show up in nn 4.72.

For image that is the code I am using and it keeps placing the image to the left in nn 4.72.

[Paul Jr]

Maybe you could post a link to the site?

[erum]

K that will make this easier. I made a few more changes.

How I want it to look is:
http://www.claybies.com/pd/index3.html
as viewed in netscape 7.1

However in ie it really looks bad. I thought nn would be my major problem, seems like ie is a pain as far as css goes.

The max I can manage in ie is put the right margin as a body background and the top one in a box. But the content area won't cover the whole page unless there is text in it and the filler graphic on the right ... I just can't get it to work unless I put it in the body background - in which case the left border gets mucked up if put in a background using div ... nn shows it complete, ie refuses to tile it unless I put some text inside the div tag. Hope u can make sense of that.

Thanx!

[Fod]

do you have to use text? can you use &nbsp ??

ill go check out the page

[Paul Jr]

Now, I assume you are trying to do something with the image "leftback.gif," correct? Do you want it to repeat down the right side of the page? Or... left side? Or... :confused:

[erum]

leftback.gif issupposed to repeat on the left side. The whole page is supposed to be of say width 80% or 90% and the area left on the right side has to have the background lineback.gif

[Paul Jr]

Why not merge leftback.gif and lineback.gif into one thin, long image. It should span the page, then you can have it repeat down. That would place the "leftback" portion of it on the left side, and the rest would be covering the rest of the background.

[Paul Jr]

Alright, I thought and thought, messed around with your code, played around a bit in Photoshop, and I think I might have gotten what you wanted.

Peep this attachment, and let me know what you think.

[erum]

Thanx!!! Can't believe that had such a simple solution!!!

One more question. If it looks ok in nn 7.1 but not in nn4.72, what does that say about all the versions in between? I mean is it ok to assume that if it looks ok in nn 7.1 it will be fine in nn 6 or everything over nn4+ l?