使身体中心元素并排并排

Question

我真的被困在这上面，没有更多的想法可以考虑......我已经看了并尝试了一切，不知道还有什么可以做...

基本上我尝试将菜单div并排放在网页上并保持全部居中。

最初我将菜单和其他内容并排使用浮动左侧然后居中它我做了左边填充..但是当你从不同的计算机用不同的屏幕查看你的网站时你可能已经猜到这完全失败了分辨率...

然后我又回到A点试图将这些东西放在中心，但现在我的菜单位于顶部，所以我不知道如何强制它们并排......

此外，我被告知要在菜单上扩展徽标......我不知道现在该做什么，因为我被卡住了。我现在真的很讨厌这个问题，我的心思是狂暴地在这里呆了16个小时....

pastebin.com/2ng4WJQT pastebin.com/4Cr0Z5Tk

目前看起来如何：

它应该如何看......

Answer 1

将标题，内容和侧边栏放在一个居中的容器中将对其进行排序。

CSS将类似于：

#container
{
width: 900px;
margin:0 auto;
}

#menu, #content
{
float:left;
}

#menu{width:20%;}
#content{width:80%;}

<强>更新

以下是演示：http://jsfiddle.net/nMUVj/

<强> HTML

<div id="container">
    <div id="header">Header content</div>
    <div id="nav">Nav bar</div>
    <div id="content">Main Content</div>
</div>

<强> CSS

#container
{
    width:70%;
    margin:0 auto;
    border:1px solid blue;
    padding:0;
}

#nav, #content{float:left; border:1px solid green;margin:0;}

#nav{width:20%;}
#content{width:79%;}