Html 并排放置2个div和css代码压缩

我已经试着学习css大约两个月了，但我发现我不能将这两个div放在同一行。我的徽标会显示在标题栏上，但我的登录按钮不会显示在标题栏上

另外，如果你们能告诉我如何缩短我的css代码来做同样的事情，那也太棒了

@导入url(http://fonts.googleapis.com/css?family=Oswald:400,700);
*{
边际：0px；
填充：0px；
}
校长{
背景色：#00B9ED；
高度：60px；
边框底部：0px；
左填充：自动；
右侧填充：自动；
宽度：100%；
-网络工具包盒阴影：0px 0px 8px 0px 000000；
-moz盒阴影：0px 0px 8px 0px 000000；
盒影：0px 0px 8px 0px 000000；
}
#标志{
左边距：15%；
}
#标志a{
垫面：3件；
高度：38px；
字体大小：35px；
字体系列：“Oswald”，无衬线；
文字装饰：无；
颜色：#FFFFFF；
}
#导航{
宽度：100px；
高度：40px；
背景色：#00B9ED；
moz边界半径：15px；
-webkit边界半径：15px；
边框：3倍实心#E5；
填充物：5px；
字体系列：“Oswald”，无衬线；
颜色：白色；
文本对齐：居中；
左缘：60%；
}
#导航p{
利润率最高：8%；
}
#导航a{
颜色：白色；
}
#导航a:链接{文本装饰：无}
#导航a:已访问{文本装饰：无}
#导航a:悬停{文本装饰：无；不透明度：0.6；}

每日报价

试着放浮动：左；在您的#徽标上

@导入url(http://fonts.googleapis.com/css?family=Oswald:400,700);
*{
边际：0px；
填充：0px；
}
校长{
背景色：#00B9ED；
高度：60px；
边框底部：0px；
左填充：自动；
右侧填充：自动；
宽度：100%；
-网络工具包盒阴影：0px 0px 8px 0px 000000；
-moz盒阴影：0px 0px 8px 0px 000000；
盒影：0px 0px 8px 0px 000000；
}
#标志{
左边距：15%；
浮动：左；
}
#标志a{
垫面：3件；
高度：38px；
字体大小：35px；
字体系列：“Oswald”，无衬线；
文字装饰：无；
颜色：#FFFFFF；
}
#导航{
宽度：100px；
高度：40px；
背景色：#00B9ED；
moz边界半径：15px；
-webkit边界半径：15px；
边框：3倍实心#E5；
填充物：5px；
字体系列：“Oswald”，无衬线；
颜色：白色；
文本对齐：居中；
左缘：60%；
}
#导航p{
利润率最高：8%；
}
#导航a{
颜色：白色；
}
#导航a:链接{文本装饰：无}
#导航a:已访问{文本装饰：无}
#导航a:悬停{文本装饰：无；不透明度：0.6；}

每日报价

一些提示（因为你问了）：1。您不必一直在每个元素上指定相同的字体；只需在父级上指定它。2. <代码>自动不是

填充

的有效属性。3.此外，您可能不需要使用太多的供应商前缀，

box shadow

和

border radius

现在得到了非常好的支持。4.您不需要在相对定位的块级元素上设置

宽度：100%

？两个div的父级是。headermenu正确吗？正确。我强烈建议大家阅读有关块级元素的内容：。基本上，这听起来像是你期望两个div坐在一起，而块级元素不是这样工作的。您需要浮动它们，绝对定位它们，或者使用

display:inline block

好的，谢谢！我现在将阅读这篇文章。不用担心，希望链接能解释得更多一些。另外，对浮动进行一些研究，这将有助于你了解实际发生的情况：

#logo {
    margin-left: 15%;
    float:left;
}