ansaurus

Question

Absolutely Positioned, Overflow Scroll, Dynamic Element

Answer 1

+1 A:

Would something like this fit your needs?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>Untitled Document</title>
        <style type="text/css">
            body {
                margin: 0;
                padding: 0;
            }
            #nav {
                position: fixed;
                float: left;
                width: 25%;
                background-color: #F00;
            }

            #filters {
                float: right;
                width: 75%;
                background-color: #FF0;
            }

            #toolbar {
                float: right;
                width: 75%;
                height: 70px;
                background-color: #00F;
            }

            #content {
                float: right;
                width: 75%;
                background-color: #0FF;
                overflow-y: scroll;
                min-height: 400px;
            }

        </style>
    </head>
    <body>

        <div id="nav">this is the nav</div>

        <div id="filters">filters</div>
        <div id="toolbar">topbar</div>
        <div id="content">content</div>

    </body>
</html>

Frankie 2009-10-27 17:58:45

Whilst I haven't tried it, I don't get why the height of the content area is 80% if the toolbar and filters section is of a fixed height? Surely it should be 100% height to fill in the gaps when the toolbar/filters aren't there?

Kezzer 2009-10-28 08:51:28

This is close, but the content area needs to always fill the entire space.

Kezzer 2009-10-28 14:15:24

@Kezzer, ah! But then you have to trough Java Script into it or stick to tables. You can get 100% height with DIV's. On the other 80% thing, your correct... I fussed about and forgot to delete the values.

Frankie 2009-10-28 16:13:30

ansaurus

tags:

views:

answers:

Absolutely Positioned, Overflow Scroll, Dynamic Element

related questions