www.webdeveloper.com
Results 1 to 2 of 2

Thread: container resize to window

  1. #1
    Join Date
    Jun 2008
    Posts
    36

    Exclamation container resize to window

    I'm sure this has been asked before but I can't seem to find it anywhere. I want to have my container always take up 100% height of the browser window minus 20 pixels on the top and bottom and 960 pixels wide.

    Green= container

    Red = logo, menus, submenus designed to fit in 1024 x 768

    pink = expands outside the window within an iframe with a scroll bar.

    Top (monitor A) is what it will look like at 1024 x 768. Bottom (monitor B) is a bigger monitor example.

    The white space at the top and bottom outside of the green container should stay the same through all browser window sizes. The problem is how to get the green container to resize to the window size even when the content (pink) goes farther down.

    How do I keep the green container the full browser height minus 20 pixels at the top and bottom?

    Does this make sense?

    Thanks!
    Attached Images Attached Images
    killerwallpapers

  2. #2
    Join Date
    Jun 2006
    Location
    Boston, MA
    Posts
    383
    try adding:
    html{height:100%;}
    body{height:100%;}

    then set your container to {height:100%;min-height:100%;}

    and add whatever padding you'd like.. that should do the trick, if not its close!
    "Problems cannot be solved by the same level of thinking that created them.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles