[thelist] interface to take 100% of screen

[Eduardo Kienetz]

On Feb 6, 2008 4:19 PM, Mark Joslyn <Mark.Joslyn at solimarsystems.com> wrote:
> Hello Evolt!
>
> Here is my dilemma that I cannot find an answer to:
>
> I need my web application to take up 100% width and 100% height of the
> browser window - No scrollbars. I have achieved this by setting the html and
> body elements like this:
>
> * { padding: 0; margin: 0; border: none }
> html, body { height: 100%; width: 100%; }
>
> The big problem is when I have a nested div like this:
>
> <div id="container">
>         <div id="header">Header here</div>
>         <div id="left">
>                 <div id="nestedHeader">Nested header here</div>
>                 <div id="nestedContent">Nested content here</div>
>                 <div id="nestedHeader">Nested footer here</div>
>         </div>
>         <div id="content">Content Here</div>
> </div>
>
> Requirements:
> 1. div.container to take up 100% width & 100% height of the browser window -
> NO SCROLLBARS
> 2. div.left to be 350px wide & 100% height - minus the height of
> div.nestedHeader
> 3. div.nestedHeader to be 100% width of div.left and 20px height
> 4. div.nestedContent to be 100% width of div.left and 100% height of
> div.left (minus the heights of div.nestedHeader and div.nestedFooter) with
> overflow set to "scroll"
> 5. div.nestedFooter to be 100% width of div.left and 20px height AND be
> anchored at the bottom of div.left
>
> I have gone through about 200 different attempts (tables, divs, javascript
> expressions, etc..) and can not get this to work.
>
> Any insights and help would be appreciated.

I do it here: http://www.noticiaslinux.com.br

-- 
Eduardo Bacchi Kienetz
LPI Certified - Level 2
http://www.noticiaslinux.com.br/eduardo/
http://eduardo.intercambista.blog.br