0

我正在处理我的网站标题，该标题在左下角有一个徽标图像（100 像素 x 100 像素）和一个使用 css 表格属性垂直居中对齐的导航栏。徽标图像和导航栏 UL 元素都位于宽度为 100% 的 #header div 中。

在不破坏我的布局的情况下减少徽标和导航元素之间差距的最佳方法是什么？

具有两个元素的网站 100% 宽度标题

添加了边框，以便可以轻松区分元素。我也在使用 Twitter Bootstrap 框架。

我的页面的 HTML 可以在这里找到：http: //pastebin.com/RpgcPDdh

这是我的CSS：

#wrapper {
    background: none repeat scroll 0 0 #FFFFFF;
    border-bottom: medium none;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
    margin: 0 auto;
    padding: 0 50px;
}

body {
    background: url("images/maze_bg.png") repeat scroll 0 0 #DDDDDD 
}

#header {
    display: table;
    padding: 20px 0;
    width: 100%;
}

#header ul{
    border: solid 1px red;
    display: table-cell;
    vertical-align: middle;
}

#header img{
    border: solid 1px blue;
}

感谢任何帮助。

4

2 回答 2

1

扔一个

margin-right: 20px;

或上的东西#header ul。这会将它向左移动。

于 2013-02-21T22:20:27.737 回答
0

padding-right 成功了！我想我应该坚持而不是在这里提出问题。

于 2013-02-21T22:29:01.480 回答