Hello
Im kinda new to CSS, and i got a pretty good understanding of it all, but I have a question.
I can make my tiled background go all the way down the page (repeat y etc), but i wanted to position it so it always falls down the right hand side of the browser window regardless of resolution and window size.
Is this possible?? Ive only seen position work on left and top coordinates.
Thanks guys.
MikeDont worry think i have figured it out, i used background-position: right
thanks anywayHi,
If I understand you correctly, you wish to have a continuously repeating image down the right hand side of the browser.
Just changing your position to right top should work (I would have thought you'd tried that seeing as you said you had tried left top
).
<style type="text/css" media="screen">
body {
background-image: url(image.gif);
background-position: right top;
background-repeat: repeat-y;
}
</style>
Sorry if i've misunderstood.
PaulHi Paul
cheers for the reply- i already tried that it worked!!
When i said about left and top, the way I understood it to work was in CSS you could only define an element to be a certain number of pixels from the left and/or from the top ie position: absolute; left 20px; top 2px; or whatever it is. But yes I understand now how to put an element down the right.
So am i right in thinking I could position something 25 pixels from the right? maybe doing right -25px ?Hi,
You can't use keywords such as right, top etc in conjunction with px or % when using background-position.
However you can position the background using :
background-position: 50px 100px;
This will define the offset of the top left corner of the origin image from the top left corner of the background. The first value is the horizontal axis and the second value is the vertical axis.
To position an image from the right hand border you would need to use percentages. You may have to use trial and error to get it exactly where you want, but a position of 50% 50% will position the middle of the image with the middle of the background. So as I understand it a position of 95% 0% should position a point at 95% of the image with a point at 95% of the background. (Percent causes the appropriate point within the origin image to be aligned with the appropriate point in the background element).
e.g.
background-position: 95% 0%;
(Note Navigator 4.x doesn't support the background-position at all)
Hope tha makes sense.
Paul
Im kinda new to CSS, and i got a pretty good understanding of it all, but I have a question.
I can make my tiled background go all the way down the page (repeat y etc), but i wanted to position it so it always falls down the right hand side of the browser window regardless of resolution and window size.
Is this possible?? Ive only seen position work on left and top coordinates.
Thanks guys.
MikeDont worry think i have figured it out, i used background-position: right
thanks anywayHi,
If I understand you correctly, you wish to have a continuously repeating image down the right hand side of the browser.
Just changing your position to right top should work (I would have thought you'd tried that seeing as you said you had tried left top
).<style type="text/css" media="screen">
body {
background-image: url(image.gif);
background-position: right top;
background-repeat: repeat-y;
}
</style>
Sorry if i've misunderstood.
PaulHi Paul
cheers for the reply- i already tried that it worked!!
When i said about left and top, the way I understood it to work was in CSS you could only define an element to be a certain number of pixels from the left and/or from the top ie position: absolute; left 20px; top 2px; or whatever it is. But yes I understand now how to put an element down the right.
So am i right in thinking I could position something 25 pixels from the right? maybe doing right -25px ?Hi,
You can't use keywords such as right, top etc in conjunction with px or % when using background-position.
However you can position the background using :
background-position: 50px 100px;
This will define the offset of the top left corner of the origin image from the top left corner of the background. The first value is the horizontal axis and the second value is the vertical axis.
To position an image from the right hand border you would need to use percentages. You may have to use trial and error to get it exactly where you want, but a position of 50% 50% will position the middle of the image with the middle of the background. So as I understand it a position of 95% 0% should position a point at 95% of the image with a point at 95% of the background. (Percent causes the appropriate point within the origin image to be aligned with the appropriate point in the background element).
e.g.
background-position: 95% 0%;
(Note Navigator 4.x doesn't support the background-position at all)
Hope tha makes sense.
Paul