并排的DIV在WordPress的/下划线(Side by Side DIVs in Wordpre

2019-10-19 10:04发布

我目前正在玩弄WordPress的起动机他们，强调启动主题化。我用CSS来尝试将并排2的DIV侧没有运气。我做了什么，我通常在这种情况下做的，但并未奏效。也没有，我已经对SO发现任何其他解决方案。

总的目标是用于报头是在屏幕宽度（居中）与网站报头和主导航的90％占用这个空间的50％。有任何想法吗？

在HTML（少PHP来避免事情过度复杂）：

<header id="masthead" class="site-header" role="banner">
    <div class="site-branding">
        <h1><a href="#">Test Site</a></h1>
    </div>

    <nav id="site-navigation" class="main-navigation" role="navigation">
        <p> menu items </p>
    </nav>
</header>

我已经尝试了最基本的CSS的解决方案：

#masthead {
    width: 90%;
    margin: 5px auto;
}

.site-branding {
    width: 50%;
    float: left;
}

.main-navigation {
    width: 50%;
    float: left;
}