WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] Replacing Background Color With an Image

[Resolved] Replacing Background Color With an Image

  • sagdude2002

    @sagdude2002

    Hi – the body of a website has a background color of white. I’m trying to put an image in the background instead of the white color.

    http://www.mikebradbury.net/

    code is:

    /* Main */

    #main {
    width: 900px;
    margin: 0 auto;
    background:#fff; <—- color white —-
    border:#ddd 3px solid;

    I’ve tried deleting the color code and inserting the image code but it didn’t work.
    There is also the body code:

    body {
    margin: 0;
    padding: 0;
    background:#6666FF; <——-color of blue———
    font-family: Verdana,Tahoma, Arial, Serif;
    line-height: 1.5em;
    font-size: 16px;
    font-size: 0.76em;
    color: #000000;

    I’ve tried replacing the color of blue code with the image code and that didn’t work either. I also replaced both color codes with the image code and that didn’t work either. Any ideas? Thank you very much.

Viewing 9 replies - 1 through 9 (of 9 total)
  • Michael

    @alchymyth

    Michael

    @roseapplemedia

    You may try adding a line like this to the .css at about line 16.

    body {
    background:url(“http://www.bestlandingpage.com/wp-content/uploads/2010/07/roseapplelogo004.png”) no-repeat scroll 0 0 transparent;
    color:#000000;
    font-family:Verdana,Tahoma,Arial,Serif;
    font-size:0.76em;
    line-height:1.5em;
    margin:0;
    padding:0;
    }

    Replace the link with your own background link.

    Michael

    sagdude2002

    @sagdude2002

    Thank you for your responses.

    @alchymyth – I tried inserting code per that link and all that happened was the outside area changed color from blue to white.

    @michael w/RoseAppleMedia – same thing. It just changed the outside areas on both sides from blue to white.

    For some reason, CSS doesn’t seem to be recognizing the image. It is in jpg format and is 49KB in size. I tried a 700KB image earlier.

    Any other ideas, please let me know. Thanks a lot!

    Mike

    Michael

    @roseapplemedia

    What is the URL to the image?

    Michael

    Moderator t-p

    @t-p

    try adding this:

    background:url(“http://www.bestlandingpage.com/wp-content/uploads/2010/07/roseapplelogo004.png”) repeat;

    sagdude2002

    @sagdude2002

    The image is in a theme image folder in my wordpress files.

    Mike

    govpatel

    @govpatel

    then you can add /images/roseapplelogo004.png

    Michael

    @roseapplemedia

    This will put the header image as the background, assuming the image is in the same folder then change the url to the image url.

    If you don’t want it to repeat the do a no-repeat.

    body {
    background:url(“http://www.mikebradbury.net/wp-content/themes/vino-cafe/img/HBHeader.jpg”) repeat scroll 0 0 #6666FF;
    color:#000000;
    font-family:Verdana,Tahoma,Arial,Serif;
    font-size:0.76em;
    line-height:1.5em;
    margin:0;
    padding:0;
    }

    Michael

    sagdude2002

    @sagdude2002

    It now works. I think I was putting quotation marks around the abbreviated path to the image file or I left out the img/ and that messed it up. It now reads:

    background:url(img/beachsand.jpg) repeat scroll 0 0 #6666FF;

    I entered the same path into the #main area and that took care of the white section also. Thanks a lot for all of your help, Michael!

    Thank you t-p and govpatel for your responses also. I appreciate it.

    Mike

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘[Resolved] Replacing Background Color With an Image’ is closed to new replies.
Skip to toolbar