SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    May 2012
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Floated background images

    Is there a practical way to set up a background image so that say 1/3 of the image is located at the top o the page, the next third repeats for the extra space, and the last third floats at the bottom?

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,118
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    It sounds like you need to divide things up into three separate divs. The top div has the top third as the bg image, and the bottom div has the bottom third. Top and bottom divs have a fixed height. Middle div has the repeating middle of the original image, and can expand to the height of the content.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  3. #3
    SitePoint Enthusiast
    Join Date
    May 2012
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is there any easy way to do this?

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,118
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by andywhizwang View Post
    Is there any easy way to do this?
    What I described is easy.

    Perhaps post a link to what you have so far, or a screen shot of what you want.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."


Bookmarks

Posting Permissions

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