Background streching .. never seen before.

liunx

Guest
Hi all,

I was wondering if someone knew how those site do the background streching, i mean on the vertical, it streches only one color. Its hard to explain, but look at the vertical, not horizontal. I know that on the horizontal, it tiles on the x-axis.

For example : <!-- w --><a class="postlink" href="http://www.torrentspy.com">www.torrentspy.com</a><!-- w -->

When you go on that site you see, you that the background stretches. But here is the back picture that the use

<!-- m --><a class="postlink" href="http://www.torrentspy.com/gfx/body_bg.gif">http://www.torrentspy.com/gfx/body_bg.gif</a><!-- m -->

How does they do it?

Is there a css property for that ?

Thanks,Not stretching, tiling. Use background-repeat:repeat-x;Look carefully

its not tilling ... i know its tilling on the x

but im looking on the vertical

it seems to strech only the blue part and not the whole background image.Well I tried to see how they were accomplishing it for you but their source is such a mess that I can barely read it, let alone find what I wanted. There is no stretch command however.The pages background colour is the same as the lower blue....Bathurst_guy is right, the background color is the same as the lower blue part of the image. Give this bookmarklet a run on the website.

javascript:void(function(){document.body.style.backgroundColor="white";}())Well that's what I assumed also, but when you right click and choose save background as it tries to save as a gif. That's what led me to believe it was a gif.Well that's what I assumed also, but when you right click and choose save background as it tries to save as a gif. That's what led me to believe it was a gif.
That is because you can save any background image used with the body regardless how big it is without even right clicking it directly.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html dir="ltr" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Ultimater's Example</title>
<style type="text/css">
body {
margin:0px;
background: white url(<!-- m --><a class="postlink" href="http://webdeveloper.com/forum/image.php?u=30185&dateline=1128637189">http://webdeveloper.com/forum/image.php ... 1128637189</a><!-- m -->) no-repeat;
color: black;
}
</style>
</head>
<body>
</body>
</html>The background image isn't stretching. The background image is repeated across (repeat-x) and the background color is set the same as the bottom line of the background image.:O thanks alot guys.

Finally solved my question.

Big Thanks!
 
Back
Top