css - 并排放置两个 DIV， float :left or right

Question

我查看并尝试了网站上的一些现有解决方案(例如 CSS Problem to make 2 divs float side by side 和 CSS layout - Aligning two divs side by side )，但它们都不适合我。

我对 CSS 有点陌生，但我正试图在我的 WordPress 网站上对齐标题和菜单 http://photography.stuartbrown.name/以类似于 http://www.kantryla.net/ 的方式.每当我 float:right 在菜单区域但是菜单消失在图像下方并且 float:left 在菜单上时它会将图像推到右边。

我知道，为了实现我想要的效果，我需要减小站点标题的大小并减小菜单的宽度(也许通过减小列表中元素之间的间隙？)，但我会非常感谢关于如何实现 kantryla 的标题和菜单布局的一些建议。

您可能注意到我编辑了主题的 PHP 以包含一个 DIV

<div class="stuart_menu">

围绕着标题和菜单，认为这样可以使封闭的元素更易于控制。不确定这是否正确，但如有必要，我可以轻松删除。

感谢您的帮助!

Answer 1

将这些样式放在您的 CSS 中

#logo {
    float: left;
    margin: 0 0 25px;
    position: relative;
    width: 20%;
}

#logo h1 {
    color: #555555;
    display: inline-block;
    font-family: "Terminal Dosis",Arial,Helvetica,Geneva,sans-serif;
    font-size: 25px;
    font-weight: 200;
    margin-bottom: 0.2em;
}

#menu {
   float: left;
   width: 80%;
}

.stuart_menu {
  overflow:auto;
}

我想就是这样。