repeat image on y axis

karloff · #1 Feb 2nd, 2006, 16:54

how do your repeat an image (shadow) down the y axis on the container box on the left and the right hand side.

got a small image which i would like to represent the shadow on the left and right. the container box will be 500px wide, centered and have no margins at the top and bottom.

any tips, cheers

herkalees · #2 Feb 2nd, 2006, 17:17

recreate the image so that it is 1 pixel high, 500 pixels wide and contains the left-side shadow and right-side shadow. Then do this with your CSS

#box {background: url(images/shadows.gif) repeat-y;}

karloff · #3 Feb 2nd, 2006, 18:20

i think i've tried what you said but no image seems to show, can you have a look at what i've done and see if you can spot any prob,

cheers 4 the reply

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Drop Shadows 2</title>

<style type="text/css">

#box{ border: 1px solid #000;
margin: 0 auto;
width:400px;
background-image: url(shadow back.png);
background-repeat: repeat-y;
}
</style>
</head>

<body>
<div id="box">
<h1>paulcurley.com</h1>
</div>

</body>
</html>

herkalees · #4 Feb 2nd, 2006, 18:33

Well, I think the width should be 500px right? Whatever width you're image is, that is the width you declare in the CSS. Also, as long as your image is in the top-level as you've declared it, you should probably be fine.

karloff · #5 Feb 2nd, 2006, 18:48

cheers man, got it working. it didn't seem to like the space in the title of the image.

thanks

herkalees · #6 Feb 2nd, 2006, 21:01

Anytime

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
image repeat	snelll	Web Page Design	9	May 26th, 2008 17:34
3D Scrolling Wheel in z-axis	bunty07	Flash & Multimedia Forum	1	Mar 11th, 2008 12:07
background-repeat: repeat y not working properly	AdRock	Web Page Design	12	Feb 25th, 2007 22:17
repeat a horizontally centered background image	Legacy_Staff	Web Page Design	12	Jul 14th, 2006 20:23
repeat-x gradientation	gwx03	Graphics and 3D	1	Jan 3rd, 2004 07:04

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
repeat image on y axis