So I used spans and tables and divs and all sorts of combinations of these things and it just got uglier and uglier. Then I tried to simplify and it just got worse.
So my aim here is to have the top 60% of the page be a div with game content and the bottom 40% with chat, and the bottom 26px be the chat input field. The nearest I've gotten is to set the input field to absolute positioning, bottom 0px, but this usually just makes the chat segment ignore its scroll:auto style and it flows right behind the field and off the end of the page. I got pretty close with tables, making a row of each thing with the chat field at the end, but the chat portion stretched up, ignoring all height restraint, growing and growing to eclipse and interfere with the top 60%.
I switched the channel tabs from spans to divs displayed inline-block because the spans were just spilling off the right edge of the window.
Don't get me started on how difficult it was to just have 100% page height and width actually mean 100% page height and width. Okay I'll tell you. CSS style *{margin:0px;padding:0px} |