html - CSS: Position Dynamically Sized div to Bottom of Static Div -


i'm adding chat functionality websocket based web app. in conventional chat windows, eldest message @ top of window , newest @ bottom. conventional chat

my implementation should share typical, top bottom element order. however, in conventional chat windows, eldest message sticks top of frame. implementation should have youngest message sticking bottom of frame. i've seen of son playing it, minecraft has ideal chat interface. in truth, minecraft chat interface appears resemble want implement.ideal chat

how, in css, can make chat messages stick bottom of window?

this easy if calc() offered means refer current height of element being applied to, like

position: relative; top: calc(240px - [current element height]); 

where 240px static height of chat window.

thanks in advance.

first, put position:relative on parent container

#container{ position:relative; } 

then, put position:absolute on chat window

#chat{ position:absolute; bottom: 0px; } 

this should handle dynamic heights.


Comments

Popular posts from this blog

angularjs - ADAL JS Angular- WebAPI add a new role claim to the token -

php - CakePHP HttpSockets send array of paramms -

node.js - Using Node without global install -