如何居中对齐徽标图像和右对齐导航ul

Question

徽标和导航都在标题div中，我希望徽标居中，导航与右侧对齐。

我尝试过显示：块和边距：自动为图像使其居中，但随后它将导航下推到下一行。

当前的css是：

.logo {
    display: inline-block;
    width: 400px
    margin: 0 auto;
}

/* Navigation */

#nav {
    display: inline-block;
    margin: auto; 
    padding:0; 
    list-style:none;
    float: right;
}   

读取我必须放宽以制作边距：自动工作但它所做的只是放大图像。感谢。

Answer 1

从float＆amp;中删除#nav将text-align:center定义为它的父级。写得像这样：

.header{
 text-align:center;
}
.logo {
    display: inline-block;
    width: 400px
}

/* Navigation */

#nav {
    display: inline-block;
    padding:0; 
    list-style:none;
    text-align:left;
}