Home/ Questions/Q 8624899
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T07:38:43+00:00

I’m trying to get a nested DIV tag, containing an Object tag, to stretch

  • 0

I’m trying to get a nested DIV tag, containing an Object tag, to stretch to its parent container remaining space.

What I have is header-content-footer template consisting of 3 DIV tags. The content DIV has an object containing another HTML page. The header and footer’s height are set to absolute pixel values. I’d like the content DIV to take up the remaining space. Whatever I do, it seems the best I can come up with is making the DIV content tag to 100% of the screen height. Here’s the code:

<body>
<div id="pageWrap">
<div id="page">
    <div id="header" style="height:68px;"></div>
    <script type="text/javascript">
            $(document).ready(function() {
                $("#header").load('header.jsp');
            });
    </script>
    <div id="mapLocation" style="width:100%; height:100%; overflow:auto;">
    <object type="text/html" style="width:100%; height:100%;" data="top/index.html"></object>
    </div>
    <div id="footer"></div>
    <script type="text/javascript">
        $(document).ready(function() {
                $("#footer").load('footer.jsp');
        });
    </script>
</div>
</div>
</body>

Any solution is good, jQuery, CSS or other!

Thanks for the help

Ggilmann

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Think this is the same as a question I answered a couple of weeks ago:
    Page fills window with content filling the gap

    • 0