My background do not extend all the way to the bottom of the entry and page

  • Resolved 4evrblu

    (@4evrblu)


    17 years, 11 months ago

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

    Look closely at https://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.

Viewing 4 replies - 1 through 4 (of 4 total)

  • 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.

    Thread Starter 4evrblu

    (@4evrblu)

    “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?

    Thread Starter 4evrblu

    (@4evrblu)

    Well, what I did was cheat…sort of.

    I decided to look at all 3 background images. Each was 1×2000 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.

    Thread Starter 4evrblu

    (@4evrblu)

    As a followup I was able to fix it.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘My background do not extend all the way to the bottom of the entry and page’ is closed to new replies.