html - a中的浮动元素

Question

我要疯了，试图让这 2 个元素漂浮在 a 内的同一行中<header>

<header>
    <h1>Hernan esta con vos</h1>
    <nav>
        <ul class="navigation-list">
            <li><a href="#">Nuestra firma</a></li>
            <li><i class="icon-ellipsis-vertical"></i></li>
            <li><a href="#">Que podemos hacer por vos</a></li>
            <li><i class="icon-ellipsis-vertical"></i></li>
            <li><a href="#">Comunicate con nosotros</a></li>
        </ul>
    </nav>
</header>

这是我的CSS

header
{
    display: block;
    width: 90%;
    margin: 0em auto;
    padding: 1em;
    text-transform: uppercase;
    overflow: auto;
}

header h1
{
    float: left;
}

header nav
{
    float: left;
}

.navigation-list
{
    margin: 0em;
    padding: 0em;
    list-style: none;
    text-align: center;  
}

.navigation-list li
{
    display: inline-block;
    letter-spacing: 0.10em;
    padding: 0em 0.25em;
}  

有人可以帮助我实现这一目标吗？

提前非常感谢大家。干杯。

Answer 1

看起来您将导航和 h1 浮动到左侧。您的元素在资产净值内。

尝试

 nav {
   float:right
   display:inline-block
   width:75%
   position:relative

   }     

nav ul li {
display:inline;
}