位置：固定 + float:对了，div在哪里？

Question

我仍在学习 HTML 和 CSS，也许这可能是一个愚蠢的错误，也可能不是。

看看我的 HTML，我有 #welcome div，但当我设置 float:right 时它消失了。

http://jsfiddle.net/TkQaU/1/

（Chrome 或 Firefox）

谢谢！

Answer 1

margin-left:100px 将您的 #container 移至右侧，导致右侧 100px 不可见。当您设置 float:right 时，.welcome 元素会移动到右侧 - 它不可见。

要解决此问题，请将 padding-right:100px 添加到 .welcome 元素。

小提琴：http://jsfiddle.net/TkQaU/3/

Answer 2

将 float:right; 更改为：

#topbar .content #welcome {
    position:absolute;
    right:100px;
}

http://jsfiddle.net/AlienWebguy /TkQaU/6/

如果你想保持浮动，你需要给它一个 100px 的 margin-right 来弥补容器的 margin-left ：

#topbar .content #welcome {
    float:right;
    margin-right:100px;
}

http://jsfiddle.net/AlienWebguy/TkQaU/4/