栏中的图标太低了

Question

我有一个简单的网站（tristantrouwen.com）。顶部有一个带有3个图标的栏。其中一个需要离开。另外两个吧。但是右边的两个图标低于左边的图标。

HTML：

<div class="icon-menu">
  <div class="click"><i class="material-icons md-36">menu</i></div>
  <div data-toggle="modal" data-target="#loginModal" aria-hidden="true"><i class="material-icons md-36 icons-right">exit_to_app</i></div>
  <div data-toggel="modal" data-target="#signUpModal" aria-hidden="true"><i class="material-icons md-36 icons-right">person_add</i></div>
</div>

的CSS：

.icons-right {
  float: right;
}

这就是问题：

我想知道如何让这些图标更高一点。

Answer 1

您需要先列出浮动的div：

<div>
    <div class="icons-right">...</div>
    <div class="icons-right">...</div>
    <div>...stuff on the left</div>
</div>

如果你把它们放在＆＃34;左边＆＃34;内容，他们会在＆＃34;离开＆＃34;之后向右浮动。 div完成。将它们放在DOM的第一个位置会将它们浮动到那个＆＃34; left＆＃34;的 start 的右边。 div，这是它的最高优势。