将元素固定到屏幕底部

Question

我始终在屏幕的最底部有一个我想要的文本框。使用以下标记和CSS，我能够把它关闭，但它下面有一个奇怪的差距，它位于其他内容之上。

标记：

<div class="content">
 ... stuff here
</div>
<div class="message-text">
  <input type="text"  placeholder="Start typing to share a message">
</div>

CSS：

.message-text {
 position:fixed;
 bottom:0px;
 width:100%;
}

这是一个视觉效果：

任何帮助都会很棒。

Answer 1

只需添加此属性即可。

.message-text {
 margin:0px;
}