4 {{ upvoteCount | shortNum }}
4 {{ upvoteCount | shortNum }}

Background-image size

by coykiesaol
3 replies
  • WEB DESIGN
    • |
I have an image that I want to use for a background, which is 800x600. Is there a way to have this expand to fit the size of the users browser?

I see in the CSS3 stuff you can change the size, but I have tried and am not sure I am using the right code!

Any help?Thanks
#backgroundimage #size
  • Profile picture of the author Brandon Tanner
    Assuming the background image is "constant" (ie won't look bad if repeated), you could try this...

    div#background
    {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background:url(background_image.png);
    }
    Signature

    {{ DiscussionBoard.errors[3051877].message }}
    • Profile picture of the author Ambius
      that will not stetch the background image.
      it will stretch the div containing the bg but the bg itself will still be tiled.


      coykiesaol
      I'm not familiar with CSS3 stuff so I don't know if that will work. You can try using a div layer with brandon's positioning and a z-index:0; that contains an <img width="100%" height="100%">
      {{ DiscussionBoard.errors[3052344].message }}
      • Profile picture of the author Brandon Tanner
        Originally Posted by Ambius View Post

        that will not stetch the background image.
        it will stretch the div containing the bg but the bg itself will still be tiled.
        Good catch! Yeah, I meant to say "repeated" instead of "stretched". I updated the post.
        Signature

        {{ DiscussionBoard.errors[3052619].message }}

Trending Topics