how to repeat a small background image througout the page?

Question

I want to set page background image my css code is-

background:url(images/body_bg.jpg) repeat-x top;

but the image size is not as large as web page thats a thin strip only and gradient color too.so how can i repeat the image so that it will occupy whole background?As I said it is gradient so I can't hardcore the background color.

if it's a gradient then repeat-y will only repeat the gradient, not stretch it as you probably want — Juan Cortés, Jun 20 '10 at 18:10
@may if i would repeat y then how it'll occupy the whole page? — nectar, Jun 20 '10 at 18:21
repeat x and y of course nectar, but my answer was a different approach — Juan Cortés, Jun 20 '10 at 18:24

Sarfraz · Accepted Answer · 2010-06-20T18:17:06.960

3

See demo here.

background:url(images/body_bg.jpg) repeat left top;

More Info:

http://www.w3schools.com/css/css_background.asp

edited Jun 20 '10 at 18:17

answered Jun 20 '10 at 18:11

Sarfraz

377,238
77
533
578

score 0 · Answer 2 · answered Jun 20 '10 at 18:25

0

You could use this background: #000000 url(images/body_bg.jpg) repeat-x top; And replace #000000 with the color, which ends your gradient.

answered Jun 20 '10 at 18:25

how to repeat a small background image througout the page?

2 Answers2