Site Background Image Problems

Discussion in 'Web Design and Development' started by oldschool, Sep 27, 2012.

  1. oldschool macrumors 65816

    oldschool

    Joined:
    Sep 30, 2003
    #1
    I can't figure this out so I thought the macrumors community would be able to help!

    My website is attached. The background of each page is a large image file. I want the image to increase in size to fill the window, but when the window is made smaller, blank space (in this case green) appears beneath. What I would like is for the image to only decrease to a certain size. I don't care that most of it is hidden when the window is a certain size, I just don't want that background to appear.

    I'm hoping for a behavior sort of like this site.

    www.g2geogeske.com


    Thanks!
     

    Attached Files:

  2. 960design macrumors 68020

    Joined:
    Apr 17, 2012
    Location:
    Destin, FL
    #2
    I use something like this for the base of most of my sites:

    Code:
    body{
      background: url(images/background.jpg) no-repeat center center fixed;
      -webkit-background-size:cover;
      -moz-background-size:cover;
      -o-background-size:cover;
      height:100%;
    }
    There's a couple more lines to get this effect with older IE browsers, but to be honest, if someone is using IE6, I just javascript a plain 'silver' colored background for them. They really are not interested in 'cool' stuff anyway.

    just me
     

Share This Page