Sorry but when you specify height:100% it will only stretch the height of the div 100% of the content.
Best solution, is a jquery solution where grabs the height of the browser port and then dynamically sets the height of the div for you on page load. Sent from my iTouch On Oct 14, 2010, at 10:22 AM, Kevin <[email protected]> wrote: > Either I implemented it wrong or you misunderstood the problem, but it > doesn't work. :( > > Still looking for a solution, if it's even possible. > > On Oct 9, 10:25 am, Kevin <[email protected]> wrote: >> Sorry I'm still somewhat confused. >> >> As soon as I add the star hack something such as >> >> #bottom { >> top: 200px; >> bottom: 0; >> | >> >> should work fine? >> >> Thank you for the response. I will have to try this in a little bit >> when I get the chance. >> >> On Oct 6, 5:55 am, Michael Kolaski <[email protected]> wrote: >> >> >> >>> Hi Kevin >> >>> I've done this in the past - you need to use a container DIV and a 'star' >>> hack to fix IE. The CSS is something like: >> >>> html, body { >>> height: 100%; >> >>> } >> >>> #container { >>> min-height: 100%; >> >>> } >> >>> * html #container { >>> height: 100%; >> >>> } >> >>> HTH >> >>> Cheers, >>> Mick >>> -- >>> Pinnacle Web >>> Designhttp://www.pinnaclewebdesign.co.uk|http://twitter.com/pinnacleweb >> >>> On 2 October 2010 16:20, Kevin <[email protected]> wrote: >> >>>> #bottomhalf { >>>> display: block; >>>> position:absolute; >>>> top:196px; >>>> bottom: 0; >>>> overflow:auto; >>>> } >> >>>> Fairly straight forward, I have a header at the top 196 pixels, and I >>>> need #bottomhalf to fill up the rest of the page; this works fine in >>>> Chrome, FF, but doesn't work in IE. >> >>>> I've tried adding "height: 100%" to body as well as #bottomhalf and it >>>> sort of works but because I plan to have scrollable content inside >>>> this div, the actual div goes all the way down to 196 pixels >>>> underneath the bottom of the window. >> >>>> Only solution I can think of is creating a 100% height HTML table with >>>> 2 rows; first one being 196px and the second one filling up the rest >>>> of the space. >> >>>> -- >>>> -- >>>> You received this because you are subscribed to the "Design the Web with >>>> CSS" at Google groups. >>>> To post: [email protected] >>>> To unsubscribe: [email protected] > > -- > -- > You received this because you are subscribed to the "Design the Web with CSS" > at Google groups. > To post: [email protected] > To unsubscribe: [email protected] -- -- You received this because you are subscribed to the "Design the Web with CSS" at Google groups. To post: [email protected] To unsubscribe: [email protected]
