WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] My background do not extend all the way to the bottom of the entry and page (5 posts)

  1. 4evrblu
    Member
    Posted 7 years ago #

    Here is a perfect example of what I am talking about.

    Look closely at http://totalphysiqueonline.com/2006/12/14/dave-drapers-thoughts-on-fitness/

    Scroll down the page and you will see that the background for the page and the entry block stop abruptly. Why is that?

    The entry block in my css is this:

    .entry{

    position:relative;

    margin:0 0 20px 0;

    border:2px solid #fff;

    background:#eee url(images/entrybg.png) repeat-x;

    color:#333;

    padding:10px 10px 0 10px;

    }

    and for the body it is this:

    body{

    margin:0;

    padding:0;

    font:76% tahoma,verdana,sans-serif;

    background:#e6e6e6 url(images/bodybg.png) repeat-x;

    color:#333;

    text-align:center;

    }

    As you can see, repeat-x is there. Why then the abrupt end to the backgrounds?

    PS: NOTE- only Safari truncates both backgrounds. Firefox and Opera truncate ONLY the entry body background. The main Body bg works as it is expected to work in both of those browsers.

  2. Ryan Fitzer
    Member
    Posted 7 years ago #

    Make sure the background color is the same as the bottom of the background image. #eeeeee is not the same color. And repeat-x means it will repeat horizontally, repeat-y is vertically.

  3. 4evrblu
    Member
    Posted 7 years ago #

    "And repeat-x means it will repeat horizontally, repeat-y is vertically."

    Duh---- LOL of course I should have known this! heheheh (man I am blushing here)

    I will check the bg color issues. Would using inherit in my CSS address this?

  4. 4evrblu
    Member
    Posted 7 years ago #

    Well, what I did was cheat...sort of.

    I decided to look at all 3 background images. Each was 1x2000 px. The prolem is that the images just don't go deeper than 2000 pixels. Some of my articles are longer than that, so there is an inherent problem.

    Since doing a repeat-y seemed unsatisfactory, I decided to make new images that were 4000 pixels high. This seems to have fixed the issue for the time being.

    I chose this option because I was unable to get the background to match the color of my images perfectly. The colors were not web safe I suppose. When PS saw them they were unable to recognize them until I switched the color chooser web safe only mode off. Then PS saw the colors. The trouble is, as background colors, these colors did not match the image colors. Grrr. hence the need to make new, longer images.

    It is most interesting because the color of the image was #e6e6e6 and when I set the background to #e6e6e6, it still did not match the color of the image and you ended up seeing this mismatch. Hmmm.

  5. 4evrblu
    Member
    Posted 7 years ago #

    As a followup I was able to fix it.

Topic Closed

This topic has been closed to new replies.

About this Topic