Html 如何将我的导航栏下拉列表与其他导航栏链接对齐?

Html 如何将我的导航栏下拉列表与其他导航栏链接对齐?,html,css,Html,Css,我在将导航栏的下拉列表链接与导航栏上的其他链接对齐时遇到了一些问题 这是我的第一个项目之一,所以我有点困惑,我应该在哪里编辑我的当前代码,以便它正确排列。有什么帮助吗 以下是该问题的屏幕截图: 显然,我实际上期望/试图做的是将“链接”下拉按钮与其他导航栏链接对齐 如果有人能帮忙,我们将不胜感激 /*导航栏集装箱*/ navbar先生{ 溢出:隐藏; 背景色:333; 字体系列:Raleway,无衬线; } /*导航栏链接*/ 纳瓦尔先生{ 显示:内联块; 列表样式类型:无; 浮动:无; 字

我在将导航栏的下拉列表链接与导航栏上的其他链接对齐时遇到了一些问题

这是我的第一个项目之一,所以我有点困惑,我应该在哪里编辑我的当前代码,以便它正确排列。有什么帮助吗

以下是该问题的屏幕截图:

显然,我实际上期望/试图做的是将“链接”下拉按钮与其他导航栏链接对齐

如果有人能帮忙,我们将不胜感激

/*导航栏集装箱*/ navbar先生{ 溢出:隐藏; 背景色:333; 字体系列:Raleway,无衬线; } /*导航栏链接*/ 纳瓦尔先生{ 显示:内联块; 列表样式类型:无; 浮动:无; 字号:1rem; 颜色:白色; 文本对齐:居中; 填充:14px 16px; 文字装饰:无; } /*链接容器*/ .链接{ 显示:内联块; 浮动:无; 溢出:隐藏; } /*链接按钮*/ .links.links按钮{ 字号:1rem; 字体家族:继承; 背景色:继承; 颜色:白色; 边界:无; 大纲:无; 保证金:0; 填充:14px 16px; } /*悬停颜色*/ .导航栏a:悬停, .links:悬停.links按钮{ 背景色:红色; } /*下拉内容*/ .下拉内容{ 显示:无; 位置:绝对位置; 背景色:f9f9f9; 最小宽度:160px; 盒影:0px 8px 16px 0px rgba0,0,0,0.2; z指数:1; } /*下拉链接*/ .下拉内容a{ 浮动:无; 颜色:黑色; 填充:12px 16px; 文字装饰:无; 显示:块; 文本对齐:左对齐; } /*下拉链接悬停颜色*/ .下拉列表内容a:悬停{ 背景色:ddd; } /*悬停时显示下拉菜单*/ .链接:悬停.下拉内容{ 显示:块; } 链接 使浮动:左链接和删除

overflow:hidden;

从链接类中。

您可以将导航栏中的内容放入flexbox并垂直居中

试试这个:

.navbar {
  display: flex;
  align-items: center;
}

希望有帮助

除了CSS,您还需要提供HTML,这样我们才能看到您的dom结构。这些信息还不够,请您提供一个更好的屏幕截图,因为我可以看到没有任何屏幕截图,还需要提供HTML代码。@RowanBaker French抱歉,这太草率了。我已经编辑了HTML和其他屏幕截图。Thanks@GreatKT抱歉,我已经为导航栏编辑了一些额外的截图和HTML。