WordPress.org

Forums

still having issues with my background. Help! [NSFW] (6 posts)

  1. assisted
    Member
    Posted 3 years ago #

    Hi all,
    I'm having issues with my background. It is not repeating correctly and leaving a white gap as you can see on both my wordpress sites:
    http://216.172.185.6/~kandy/members
    http://216.172.185.6/~kandy/guests

    I tried setting a colour for the background but that still left the white gap! I want the gradient background image to be on the entire background of the page, repeating, no gaps.

    my stylesheet is:
    [CSS moderated as per the Forum Rules. Please just post a link to your site.]

    thank you!

  2. mylastof
    Member
    Posted 3 years ago #

    in css i found :

    body
    {
            background:transparent url('http://216.172.185.6/~kandy/images/bg.jpg') repeat-x center bottom;
    }

    you should add background color, so like this :

    body
    {
            background: #ff5ab0 url('http://216.172.185.6/~kandy/images/bg.jpg') repeat-x center bottom;
    }

    hope can make better :D

  3. assisted
    Member
    Posted 3 years ago #

    hi
    that kind of helps but look here now (only done the members site first)
    http://216.172.185.6/~kandy/members/

    when the background repeats it doesnt fade into eachother?
    any idea how to solve that?

    thank you!!

  4. assisted
    Member
    Posted 3 years ago #

    ok ive redesigned my background to a gif and 10x400 pixels

    and added this code

    [CSS moderated as per the Forum Rules. Please just post a link to your site.]

  5. alchymyth
    Forum Moderator
    Posted 3 years ago #

    your background 'structure' is:

    -'top background' gradient black-to-pink-
    -pink filler-
    -'bottom background' gradient black-to-pink-

    this is the 'top background':

    #art-page-background-gradient
    {
            position: absolute;
    	background-image: url('http://216.172.185.6/~kandy/images/bg.jpg');
    	background-repeat: repeat-x;
    	top:0;
    	width:100%;
    	height: 900px;
    
    }

    and this is the 'bottom background':

    body
    {
            background:#ff5ab0 url('http://216.172.185.6/~kandy/images/bg.jpg') repeat-x center bottom;
    }

    the 'filler' is done with the background color #ff5ab0.

    you would need to make a new image for the bottom background, and turn the image upside-down to hopefully fade into each other; might not work in very short pages.

    ------
    generally, this whole topic has nothing to do with wordpress - consider to learn the basics of css formatting - free tutorials are available online.

  6. assisted
    Member
    Posted 3 years ago #

    ok everyone the code is working right now my problem was not making the background into a better file, so i now have made a 10x900 pixels gradient and saved it as a gif and using the code i just posted seems good now!
    http://216.172.185.6/~kandy/members/

Topic Closed

This topic has been closed to new replies.

About this Topic