[thelist] interface to take 100% of screen

Eduardo Kienetz eduardok at gmail.com
Thu Feb 7 08:41:51 CST 2008


Ah, duh, I didn't pay attention you want no vertical scrolling too...

On Feb 7, 2008 9:39 AM, Eduardo Kienetz <eduardok at gmail.com> wrote:
>
> 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
>



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



More information about the thelist mailing list