I have a layout specified (simplified) as (problem description at end):

/* --- css --- */
body{
    font-family:verdana, arial, sans-serif;
    font-size:12px;
    line-height:14px;
    background:url(/images/hatch.gif)
}
#container{
    position: absolute;
    top:10px;
    height:100%;
    width:100%;
}
#outsidewrapper{
    position: absolute;
    width: 792px;
    height:100%;
    left: 50%;
    top: 94px;
    margin-left: -396px;
    background:url('/images/green_stripe.gif') repeat-y;
}
#insidewrapper{
    position:absolute;
    top:0px;
    left: 50px;
    width: 625px;
    background: #ffffff;
}
#article {
    position: absolute;
    height: auto;
    width: auto;
    left: 180px;
    top: 130px;
    margin-right:10px;
}

<!-- xhtml -->

<div id="container">
  <div id="outsidewrapper">
    <div id="insidewrapper">
      <div id="article">
        stuff here for the article that
        has a certain height, probably
        larger than that of the window
      </div>
    </div>
  </div>
</div>

The intent of this is to provide a cross-hatched background (body
tag), with a container starting 10px lower that adjusts to the height
and width of the content.

Inside this container is a outsidewrapper that has some background
striping (design sugar), and on top of that, an insidewrapper that is
white to hold the content.

Among other things contained in insidewrapper is article, which will
hold the most content.

PROBLEM: Everything looks exactly as intended, except the striping
(outsidewrapper) and white article background (insidewrapper) stop
after <whatever the body height was> pixels, leaving the remaining
content in article against the body background, which is a repeating
crosshatch.

I understand why this is happening -- 100% is 100% of the containing
block. I just don't know the fix to make the white box extend to the
bottom of the enclosed content.

You can see one iteration of this site at: http://www.travsavvy.com
(waaay early prototype, be kind).

TIA
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to