html float 堆叠顺序

Question

我有我想要 float 的树元素，

<div class="title">Name</div>
<div class="description">slogan</div>
<div class="navbar"></div>

CSS 是:

.title, .description{
float:left;
}
.navbar{
float:right;
}

我希望网站描述先于导航栏位于标题下方。

所以，我知道我的 html 是错误的，左边的两个 float 应该在它们自己的 div 中，那个 div 应该有一个百分比宽度，这样它会强制它们堆叠，但我不想设置宽度这样做限制了可以输入的内容。理想情况下，我只需要三个内联元素，这样它们的宽度就可以是动态的。

谢谢!杰西。

编辑:

这是 fiddle : https://jsfiddle.net/fLw8xac0/1/

如你所见，导航栏首先堆叠

Answer 1

只需将 .description 放在 .navbar 下并删除 float。

<style>
    .title {float: left;}
    .navbar {float: right;}
</style>

<div class="title">Name</div>
<div class="navbar"></div>
<div class="description">slogan</div>

https://jsfiddle.net/fvqx6z3f/