I have used this <http://web2py.com/books/default/chapter/29/12/components-and-plugins#LOAD> example and noticed that with more items submitted, the textarea keeps moving down. How can I keep it sticky at the bottom of the page as the items scroll with more submissions. This is my code.
{{for post in posts:}} <style> .body { left:0; top: -10px; display: table; width: 100%; max-height: 35em; } .message right appeared{ background-color: #38D9D6; float: right; display: inline-block; max-height: 150px; width:90%; border-radius: 15px 1px 15px 15px; padding: 4px; text-align: center; -ms-word-break: break-all; word-break: break-all; word-break: break-word; -ms-hyphens: auto; -moz-hyphens: auto; hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; word-wrap: break-word; font-family:'Josefin Slab Thin'; } .message left appeared{ background-color: #38D9D6; float: left; display: inline-block; max-height: 150px; width:90%; border-radius: 15px 1px 15px 15px; padding: 4px; text-align: center; -ms-word-break: break-all; word-break: break-all; word-break: break-word; -ms-hyphens: auto; -moz-hyphens: auto; hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; word-wrap: break-word; font-family:'Josefin Slab Thin'; } .bottom_wrapper .send_message { width: 140px; height: 40px; display: inline-block; border-radius: 50px; background-color: #a3d063; border: 2px solid #a3d063; color: #38D9D6; cursor: pointer; transition: all 0.2s linear; text-align: center; float: right; } .bottom_wrapper .send_message:hover { color: #a3d063; background-color: #fff; } .bottom_wrapper .send_message .text { font-size: 18px; font-weight: 300; display: inline-block; line-height: 48px; } #bottom_wrapper { left:0; bottom: 0; position: fixed; width: 100%; height: 5.0em; color: black; background-color: white; font-family: "Josefin Slab"; text-align: center; } #footer{ background-color:red; position:fixed; bottom:0px; left:0px; right:0px; height:50px; margin-bottom:0px; } </style> <div> <div class="row"> <div class="col-lg-12" > <div class="message right appeared" class="posts" style="background-color:yellow;"> On {{=post.created_on}} {{=post.created_by}} says <blockquote class="posts_body">{{=post.message}}</blockquote> </div> </div> </div> <div class="row"> <div class="col-lg-12" > <div class="message left appeared" class="posts" style="background-color:blue;"> {{for reply in replies:}} On {{=reply.created_on}} {{=reply.created_by}} says <blockquote class="replies_body">{{=reply.message}}</blockquote> </div> <br> {{pass}} {{pass}} </div> </div> <div class="bottom_wrapper" id="footer"> {{=form.custom.begin}} <div class="row"> <div class="col-lg-8" > {{=form.custom.widget.message}} </div> <div class="col-lg-4" > {{=form.custom.submit}} </div> {{=form.custom.end}} </div> </div> -- Resources: - http://web2py.com - http://web2py.com/book (Documentation) - http://github.com/web2py/web2py (Source code) - https://code.google.com/p/web2py/issues/list (Report Issues) --- You received this message because you are subscribed to the Google Groups "web2py-users" group. To unsubscribe from this group and stop receiving emails from it, send an email to web2py+unsubscr...@googlegroups.com. To view this discussion on the web visit https://groups.google.com/d/msgid/web2py/10afc053-64c1-4509-8d6a-7655a1484852%40googlegroups.com.