Page 1 of 1
CSS Background Repeat at top
Posted: Wed May 23, 2007 12:46 pm
by icesolid
I was just wondering how to make a background image repeat at the top of the site only.
Like the yellow gradient used at the top of
http://www.cnet.com.
Posted: Wed May 23, 2007 1:53 pm
by toasty2
They probably just set the width to 100%. Its being stretched out..but you don't notice because its pixels never change as they go horizontally.
Posted: Wed May 23, 2007 1:58 pm
by aaronhall
Code: Select all
background:url('gradient-image.png') repeat-x;
in the body or wrapper div. The image will be repeated rather than stretched.
Posted: Wed May 23, 2007 3:33 pm
by icesolid
I found this piece of code to work perfectly as needed.
Code: Select all
body {
background-image: url("images/fixed_bg.gif");
background-position: top;
background-repeat: repeat-x;
background-attachment: fixed;
}
Posted: Thu May 24, 2007 7:16 am
by feyd
Quotes are not needed.
Posted: Thu May 24, 2007 12:10 pm
by nickvd
icesolid wrote:I found this piece of code to work perfectly as needed.
Code: Select all
body {
background-image: url("images/fixed_bg.gif");
background-position: top;
background-repeat: repeat-x;
background-attachment: fixed;
}
With the exception of the background-attachment property, what you just posted there will work
identically to the code that aaronhall posted...
