div和ul对齐

问题描述

| 我需要菜单（房屋，投资组合，服务等）在中间和左侧对齐。 div＃header-login应该正确刷新 如何完成这些任务？ 为了解决第一个问题，我在div上添加了display：inline;但是由于某种原因ul＃header-menu在顶部留了一个空格 为了解决第二个问题，我尝试将div＃header-login的宽度设置为100％，从而使文本向右对齐，但是失败了。 这是完整的代码：     

解决方法

实现此目的的最简单方法是确保将所有内容都浮动在标头中。当前混合了一些浮动和一些非浮动（加上一些带有display：inline的元素），如果您需要在旧版本的Internet Explorer中使用它，这将很难管理并且可能会出现问题。 我对您的jsFiddle做了一些小的修改。现在，这会在标头中浮动3个元素，并将浮动清除应用于标头div本身，以便标头之后的内容可以正确清除（也有注释性示例，说明您需要如何使用条件样式表对IE进行此操作） 。 http://jsfiddle.net/y4Qyw/1/ 我没有专门调整间距，但是现在应该以某种填充和/或边距将所有内容定位在所需的形式上。除非您使用display：table-cell（并非完全跨浏览器），否则在这种情况下无法进行自动垂直定位，因此您只需要向下垂直偏移菜单就可以了居中对齐。     ,这是交易：

div#header
{
    clear:both;
    overflow:hidden;
}
div#header-login
{
    text-align: right;
    overflow:hidden;
    float:right;
    margin-top:-30px;
}
img#header-logo
{
    display: block;
    float:left;
}

ul#header-menu
{
    margin: 0 auto;
    padding: 15px;
    display: block;
    list-style-type: none;
    overflow:hidden;
}