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.

Reply via email to