聊天功能的样式问题

Question

我为iOS制作了一个包含聊天功能的应用程序。

现在我有几个问题。你可以看到两个屏幕截图，一个是键盘向上，另一个是键盘向下。键盘向上的那个有几个问题，你可能会注意到：输入框位置太高，标题刚刚上升，并且有一个“完成”栏，我想摆脱。{{ 3}}

代码：

body {
    margin:0px;
    padding:0px;
    background-color:#FFF;
}

#header_holder {
    display:inline-block;
    height:40px;
    width:100%;
    float:left;
    position:relative;
}

#header_container {
    display:inline-block;
    float:left;
    width:100%;
    height:40px;
    background-color:#e6007e;
    background-color:#F4F4F4;
    text-align:center;
    padding:0px 0px 0px 0px;
    position:fixed;
    top:0px;
    left:0px;
    z-index:700;
}

#header_container #settings {
    position:absolute;
    left:10px;
    top:10px;
    height:30px;
    width:30px;
    color:#FFF;
    color:#333;
    line-height:30px;
    font-size:20px;
}

#header {
    display:table;
    width:auto;
    height:40px;
    line-height:40px;
    margin:auto;
}


#header span {
    color:#FFF;
    color:#333;
    display:inline-block;
    float:left;
    width:auto;
    font-family:'Open Sans', sans-serif;
    font-family:Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", monospace;
    font-family: 'Permanent Marker', cursive;
    height:40px;
    line-height:40px;
    font-size:17px;
    margin-left:-2px;
    font-weight:400;
    font-style:italic;
}

#header {
    display:inline-block;
    float:left;
    width:100%;
    height:40px;
    position:relative;
}

#header #back_button {
    position:absolute;
    width:40px;
    height:40px;
    line-height:40px;
    font-size:30px;
    left:0px;
    display:inline-block;
    text-align:center;
    float:left;
    top:0px;
}

#header #back_button.hover {
    color:#ba6e6f;
}

#header #header_content {
    display:table;
    width:auto;
    height:40px;
    line-height:40px;
    color:#333;
    font-family:'Open Sans', sans-serif;
    font-size:15px;
    margin:auto;

}

#content {
    font-family:'Open Sans', sans-serif;
    padding:0px 0px 60px 0px;
}

#message {
    display:inline-block;
    float:left;
    width:100%;
    height:auto;
    position:fixed;
    bottom:0px;
    left:0px;
    border-top:1px solid #ccc;
    background-color:#FFFFFF;

}

#message #message_input {
    display:inline-block;
    float:left;
    width:75%;
    min-height:50px;
    height:auto;
    padding:1px 1% 1px 1%;
    margin:2px 1% 2px 1%;
    border:1px solid #ccc;
    border-radius:5px;
    font-size:16px;
    font-family:'Open Sans', sans-serif;
    outline:none;
    -webkit-appearance:none;
}

#message #message_send2 {
    display:inline-block;
    float:right;
    width:20%;
    height:40px;
    text-align:center;
    line-height:40px;
    transition: all .1s ease-in-out;
    position:relative;
}

#message #message_send {
    position:absolute;
    top:50%;
    margin-top:-8px;
    width:20%;
    right:0px;
    text-align:center;
}



#message #message_send.hover {
    color:#ba6e6f;
}

#content .message {
    display:inline-block;
    width:auto;
    max-width:65%;
    height:auto;
    line-height:20px;
    background-color:#ECECEC;

    border-radius:5px;
    padding:5px 2% 5px 2%;
    clear:both;
    color:#333;


}

#content .message.user {
    float:right;
    margin:7px 10px 7px 0px;
    border-bottom-right-radius:0px;
}

#content .message.connection {
    float:left;
    margin:7px 0px 7px 10px;
    border-bottom-left-radius:0px;
    border-bottom:1px solid #D4A5A6;
}

#content .message .content {
    display:inline-block;
    float:left;
    width:auto;
    height:auto;
    font-size:13px;
}

#content .message .time {
    display:inline-block;
    float:right;
    width:auto;
    height:auto;
    font-style:italic;
    margin:0px 0px 0px 5px;
    font-size:10px;
}

如何解决这些问题？