CodingForums.com

CodingForums.com (http://www.codingforums.com/index.php)

- HTML & CSS (http://www.codingforums.com/forumdisplay.php?f=13)

- - AlexG (http://www.codingforums.com/showthread.php?t=283941)

AlexG

12-10-2012 11:00 PM

AlexG

How can I get the background on http://outnout.net/wordpress/ be centered and actually be the background of the whole site using css. Thank you for all your help!!!!!

Excavator

12-10-2012 11:17 PM

Hello AlexG,
See what this does for your background -

Code:

body {

  background: url("http://outnout.net/wordpress/wp-content/uploads/2012/12/backgroudnrays.jpg") fixed center; 

        -webkit-background-size: cover;

        -moz-background-size: cover;

        -o-background-size: cover;

        background-size: cover;; 

}

See CSS Background position property here.

AlexG

12-11-2012 03:23 AM

That did not work. It just completely removed it

Excavator

12-11-2012 09:01 AM

Quote:

Originally Posted by AlexG (Post 1298966)

That did not work. It just completely removed it

Probably because you used background-image:. Notice in my example it only says background:

backa

12-11-2012 09:05 AM

check if it's a typo in 'backgroudnrays.jpg'?

AlexG

12-11-2012 06:24 PM

Quote:

Originally Posted by Excavator (Post 1299007)

Probably because you used background-image:. Notice in my example it only says background:

That made it work. Thank you very much. Now how do I get it to go into the whole site (the header and footer)?

Excavator

12-11-2012 07:23 PM

Quote:

Originally Posted by AlexG (Post 1299120)

That made it work. Thank you very much. Now how do I get it to go into the whole site (the header and footer)?

Remove any images/colors you have covering backgroundrays.jpg -

Code:

#header_outer {

    background: none repeat scroll 0 0 #00C5CC;

}

#bottom {

    background: url("1-default/footerbg.png") repeat-x scroll left top #00C5CC;

}

AlexG

12-11-2012 08:47 PM

Quote:

Originally Posted by Excavator (Post 1299130)

Remove any images/colors you have covering backgroundrays.jpg -

Code:

#header_outer {

    background: none repeat scroll 0 0 #00C5CC;

}

#bottom {

    background: url("1-default/footerbg.png") repeat-x scroll left top #00C5CC;

}

Is this the code to fix it or is this just the code you got off the site?

Excavator

12-11-2012 10:46 PM

That is your CSS that loads the images in your header and footer that cover up the backgroundrays.jpg.

Remove those lines and you'll see the background behind those images.

AlexG

12-11-2012 11:17 PM

Quote:

Originally Posted by Excavator (Post 1299177)

That is your CSS that loads the images in your header and footer that cover up the backgroundrays.jpg.

Remove those lines and you'll see the background behind those images.

Worked perfectly. Thank you so much

All times are GMT +1. The time now is 09:37 PM.