asked on

Image stay at the same place

How the background image stay at the same place when user scroll the page up and down and also move it halfway down the page and tiling it horizontally by using css?

Thanks

<html>
<head>
<ttle></title>
<style type = "text/css">
body
{
background-image:url('MyPicture.png');
background-repeat:no-repeat;
} 
</style>
</head>
<body>
</body>
</html>

Open in new window

Julian Hansen

Have you tried this

<html>
<head>
<ttle></title>
<style type = "text/css">
body
{
background-image:url('MyPicture.png');
background-position:center;
background-repeat:repeat-x;
background-attachment:fixed;

} 
</style>
</head>
<body>
</body>
</html>

Open in new window

mustish1

ASKER

its showing a bunch of images. Is there any way it shows only one

Thanks

Julian Hansen

Change

background-repeat:repeat-x;

To

background-repeat:none;

mustish1

ASKER

The code fill it up the whole page with the image.

<html>
<head>
<ttle></title>
<style type = "text/css">
body
{
background-image:url('mypic.png');
background-position:center;
background-repeat:none; 
background-attachment:fixed;

} 
</style>
</head>
<body>
</body>
</html>

Open in new window

ASKER CERTIFIED SOLUTION

Julian Hansen

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

mustish1

ASKER

Thanks

Julian Hansen

You are welcome - thanks for the points.