html - 为什么<form>在<nav>中不能正确对齐？

我想在HTML网页的<nav>标记中插入搜索栏。它基本上是一个HTML<form>的文本框，我希望它是右对齐的，而其他菜单项应该具有默认对齐方式（其他菜单项是纯文本，即带有链接的<h2>标题）。
这是我页面的<nav>栏（页面是.PHP页面）：

<nav>
    <!--site navigation links-->

    <h2 style="display:inline-block;">
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="index.html" style="color:#ffdd77;">
    Home.</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <a href="about.html">About.</a></h2>

    <!--search bar-->

    <form align="right" action="search.php" method="GET"
     style="display:inline-block;">
            <input type="text" name="query" placeholder="keyword search" />
            <input type="submit" name="submit" value="Search" />
    </form>

</nav>

问题是<form>没有正确对齐。输出如下图所示：

我还尝试将align标记的<input/>属性设置为"right"，但仍然没有帮助。我可以通过在导航链接和表单之间放置一些空格（ -大约90个空格）将它移到右端，但是否有办法使用任何HTML/CSS属性/参数来完成？

最佳答案

<form action="search.php" method="GET"
     style="display:inline-block;float:right!important;margin-top:25px;">
        <input type="text" name="query" placeholder="keyword search" />
        <input type="submit" name="submit" value="Search" />
</form>

这应该管用。
看看这个JSFiddle

关于html - 为什么<form>在<nav>中不能正确对齐？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41258858/