Html 将搜索栏与导航中的其他元素对齐

我以前问过一个关于将搜索栏移到导航栏最右侧的问题，在回答之后，我成功地将其移到了右侧，但是现在搜索栏与其他元素不一致（以前是）。哪个CSS属性（如果有的话）阻止了它的发生，解决方案是什么

代码：

正文
{
保证金：0；
背景：#222；
字体大小：300；
背景图像：url（'logo.jpeg'）；
}
.集装箱
{
宽度：80%；
保证金：0自动；
}
标题
{
背景：#f3e5ab；
位置：相对位置；
}
标题：：之后
{
内容：''；
显示：表格；
明确：两者皆有；
}
导航
{
浮动：左；
}
导航ul
{
保证金：0；
填充：0；
列表样式：无；
}
李海军
{
显示：内联块；
左边距：70像素；
填充顶部：30px；
位置：相对位置；
}
海军ulli a
{
颜色：#444；
文字装饰：无；
文本转换：大写；
字体大小：14px；
}
导航a：悬停
{
}
导航a：：之前
{
内容：''；
显示：块；
高度：5px；
宽度：0%；
背景色：#444；
过渡：所有输入输出均为500ms；
}
导航a:悬停：：之前
{
宽度：100%；
}
形式，形式
{
浮动：对；
}
.搜索栏
{
浮动：对；
}
最后一个孩子
{
位置：绝对位置；
右：0；
排名：0；
利润率：15px；
填充：0；
}

就您选择的总体布局和方法而言，我不能说我在同一页上，但这里有一个快速解决方案（如果我正确理解您的问题）

只需将top:0更改为bottom:0，并删除最后一个子项上的边距bottom

body
{
    margin: 0;
    background: #222;
    font-weight: 300;
    background-image: url('logo.jpeg');
}

.container
{
    width: 80%;
    margin: 0 auto;
}

.container::after {
  content: '';
  displayt: table;
  clear: both;
}

header
{
    background: #f3e5ab;
    position: relative;
}

header::after
{
    content: '';
    display: table;
    clear: both;
}

nav
{
    float: left;
}

nav ul
{
    margin: 0;
    padding: 0;
    list-style: none;
}

nav li
{
    display: inline-block;
    margin-left: 70px;
    padding-top: 30px;
    position: relative;
}

nav ul li  a
{
color: #444;
text-decoration: none;
text-transform: uppercase;
font-size: 14px;
}

nav a:hover
{

}


nav a::before
{
    content: '';
    display: block;
    height: 5px;
    width: 0%;
    background-color: #444;

    transition: all ease-in-out 500ms;


}
nav a:hover::before
{
    width: 100%;
}

form .form
{
    float: right;
}

.search-bar
{
    float: right;
}

ul li:last-child
{
position: absolute;
right: 0;
bottom: 0;
margin: 15px;
margin-bottom: 0px;
padding: 0;

}