How to right-align a background image tile

Forum Moderators: open

Message Too Old, No Replies

How to right-align a background image tile

Jamieos

7:31 am on Aug 16, 2003 (gmt 0)

I want to make some frame pages.
On one of the pages I want to use a narrow background gif to tile down the far right hand side of the page but I can't seem to work out how to do it. Is it possible?
I have no trouble making the background gif tile down the left side of a page.
I have tried using a mirror image of the gif file but when I view the page in the browser there is no background tile. Any help would be appreciated.

le_gber

8:45 am on Aug 16, 2003 (gmt 0)

You can use CSS to align a bg to the right like this

.rightalignbg{
background-image: url(path/to/your_image.gif);
background-repeat: repeat-y;
background-position: right;
}

But it doesn't work with older browser.

If you know the size of your frame you could use the reverse of your image as you said you did.

Could you past the code of your frame here (and remove any specific file name or url) so we can check if the pb is not coming from somewhere else.

Leo

tedster

3:43 pm on Aug 16, 2003 (gmt 0)

Welcome to WebmasterWorld, Jamieos.

If this image doesn't need to have any content displayed on top of it, you might be able to create another frame at the far right just to hold the tiled image - easy to do and very backward compatible.

Jamieos

12:21 am on Aug 17, 2003 (gmt 0)

Thanks for your prompt responses.
I will try them out and get back to you shortly

Jamieos

2:18 am on Aug 17, 2003 (gmt 0)

Here is what I have used. Only a blank white page is displayed in the browser (IE 6.026)

page.html, bg.css and tile.gif are all in the same folder.

The page with the tiled background

<html>
<head>
<title>Untitled</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="bg.css">
</head>

The stylesheet

body {
}
.rightalignbg{
background-image: url(tile.gif);
background-repeat: repeat-y;
background-position: right;
}

Wertigon

7:06 pm on Aug 17, 2003 (gmt 0)

Try changing background-position to "top right;"

Jamieos

5:44 am on Aug 20, 2003 (gmt 0)

Thanks everyone.

Your suggestions were well received