css div alignment top

Question

我的代码：

<div id="container">
<div id="header">
<h1>Hello.</h1>
</div>
<div id="welcome" >
<a href="/eciepecie">Login</a>
</div></div>

#welcome{
color: #333333;
font-size: 90%;
float: right;
text-align: right;
padding-right: 30px;
}
#header{
padding: 10px 20px;
width: 400px;
}
#header h1 {
line-height:20px;
float: left;
background: #ffffff url('../img/hello.png') no-repeat left;
color: #222222;
padding: 0px 30px;
}

我希望两个div（标题和欢迎）都是“对齐顶部”，但它们不是， - ＆gt;左边一个#header在左边div。

Answer 1

我删除了“Hello”周围的<h1>标记。并做了以下更改：

#welcome{
    color: #333333;
    font-size: 90%;
    padding-top: 10px;
    text-align: right;
    padding-right: 30px;
}

#header{
    padding: 10px 20px;
    width: 400px;
    float: left;
}

<h1>标记通常具有预定义的填充和其他属性，可以抛弃间距等内容。

<强> Example

Answer 2

将float: left;放在他们两个上。