Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    viq
    viq is offline
    New to the CF scene
    Join Date
    Feb 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question 2 Image Backgrounds with 100% width height

    Hey how's it going?

    I'm stuck in a rut as I am trying to figure out how to get two backgrounds to work with one another. Basically, I have one bg that repeats on the x coordinate. The bg height is about 500 px. What I want to do, is have an image, about 4x4 pixels in size repeat on the whole page, so that it fills in that white gap at the bottom of the page. EX: http://www.vekturlab.com/test/test.html

    I can get it to work in IE, but not in firefox. Basically the height of the pixel square does not want to stretch 100% or tile on the y coordinate. I hope this make sense. Thanks in advance.

    Code:
    body {
    	background: url(images/bg.jpg) repeat-x top;
    	margin: 0px 0px 0px 0px;
    	height: 100%;
    }
    
    #greypx {
    	background: url(images/px.jpg) repeat bottom;
    	margin: 0px 0px 0px 0px;
    	height: 100%;
    }

    -Vic

  • #2
    Senior Coder
    Join Date
    Jan 2005
    Location
    Memphis, TN
    Posts
    1,785
    Thanks
    8
    Thanked 131 Times in 129 Posts
    try changing this:

    #greypx {
    background: url(images/px.jpg) repeat bottom;
    margin: 0px 0px 0px 0px;
    height: 100%;
    }

    to this:

    #greypx {
    background-image: url(images/px.jpg);
    margin: 0;
    }

    you also have an extra </div> in your html.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •