0

我正在我的网站上创建类似 Facebook 的聊天。因此，每当用户单击与某人聊天时，聊天窗口应在右下角打开。下一个窗口应留给其他打开的聊天窗口。聊天窗口也不应占用额外页面上的高度。它们应该被放置在更高的 z-index 以重叠它们后面的页面内容。我在 css 方面不是那么好，请帮助。以下是我正在使用的代码，但它不能正常工作

.chat{
    z-index:50;
    width: 300px;
    height:300px;
    margin-left:10px;
    float:right;
    border:1px solid blue;
}

我得到了这个，它在页面上添加了滚动条，而不是非常正确。

在此处输入图像描述

4

3 回答 3

3

你需要有一个父元素（一个 div ）：

.parent { position: fixed; bottom: 0; left: 0; right:0; width: 100%; }

您需要固定位置，以便栏保持在浏览器的底部，而不是您的页面。就像你的聊天 div 的容器，它应该有

.chat { float: right; position: relative; }

所以他们可以充当他们实际聊天的容器

这是几个聊天窗口的小提琴：

http://jsfiddle.net/SXZKe/1/

编辑：添加了小提琴

于 2013-02-21T17:55:10.687 回答
0

尝试删除浮动：右，添加位置：固定，右：0％，底部：0％；

于 2013-02-21T17:54:26.367 回答
0

为此使用底部 css 属性：

http://www.w3schools.com/cssref/pr_pos_bottom.asp

于 2013-02-21T17:54:44.717 回答