Background image for site

[rocketrod]

Hi, please can i have help on changing the colour background to a simple pattern background. I want to use the pale blue (main_bg.gif) on the website www.earlcraftncake.com and use it on www.earlcraftncake.com/cart.
I have been playing around for ages and just cant get the code right in the stylesheet, thanks Rod

[Kim]

Copy the image to YOUR_TEMPLATE/images/

Add to your stylesheet under the BODY selector:

background-image: ur(../images/main_bg.gif);

[rocketrod]

Um I still havnt got it right, could you please correct the section for me.

body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
background-image: url(....images/main_bg.gif);
}


Thanks, Rod

[barco57]

just copy and paste this over your body rule:

body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
background: url(../images/main_bg.gif) repeat;
background-attachment: fixed;
}

[barco57]

and to get ahead of your next question use the following lines in the #logoWrapper and #mainWrapper rules:

background: url(../images/main_bg.gif) repeat;
background-attachment: fixed;

This will place the background like on your other page

[rocketrod]

Thanks Kim and Barco57, but still no joy. not sure about the #mainWrapper and logoWrapper rules though. i lost my logo ( restored back to before) here are the three sections discussed from my stylesheet

body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
color: #000000;
background-color: #e5edf5;
}


#logoWrapper{
background-image: url(../images/header_bg.jpg);
background-repeat:no-repeat;
/*background-repeat: repeat-x;*/
background-color: #ffffff;
height:75px;



#mainWrapper {
background-color: #ffffff;
text-align: left;
width: 750px;
vertical-align: top;
}

Oh , also i am a little bit confussed with the url section, do i type in my full path of url(http//www.........etc/images/main_bg.gif); or is it left with the two periods url(../images etc) Thanks , rod

[barco57]

do you want solid background or the grid pattern?

If you want the grid pattern then the body rule I posted works. Tested in firefox w/webdeveloper which lets me change your stylesheet dynamically and see the changes, so I know I can get the grid on the page background

[rocketrod]

Thanks barco57, yes i want the grid pattern, could you give a little more info on the stylesheet changes, thanks Rod

[barco57]

you currently have:

body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
color: #000000;
background-color: #e5edf5;
}

you want it to be like this exactly:

body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
background: url(../images/main_bg.gif) repeat;
background-attachment: fixed;
}

items in green leave alone.
items in red need to be changed from what you have to what I have.

and yes url(../images/main_bg.gif) is the correct way to point to the images

got it?

[barco57]

I think I screwed up the line should be:

background-image: url(../images/main_bg.gif);

I added the "-image" and removed the "repeat" at the end. the image will automatically repeat.