Html 导航栏下拉菜单列表中的第二列

嗨，我已经制作了一个带有导航栏的网页。导航栏上有鼠标悬停下拉菜单。我从w3school网站获取了这个导航栏的代码。代码是

ul{
列表样式类型：无；
保证金：0；
填充：0；
溢出：隐藏；
背景色：#333；
}
李{
浮动：左；
}
李a,，
.dropbtn{
显示：内联块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
}
李a：悬停，
.dropdown:悬停.dropbtn{
背景色：红色；
}
li.下拉列表{
显示：内联块；
}
.下拉内容{
显示：无；
位置：绝对位置；
背景色：#f9f9f9；
最小宽度：160px；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
z指数：1；
}
.下拉内容a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
文本对齐：左对齐；
}
.下拉列表内容a：悬停{
背景色：#f1f1
}
.下拉：悬停.下拉内容{
显示：块；
}

导航栏中的下拉菜单
将鼠标悬停在“Dropdown”链接上以查看下拉菜单。

您可以通过将

.Dropdown内容

div包装成

flexbox

来放置它

我添加了

.wrapper

一个类，您可以将其更改为任何您喜欢的内容。 代码如下：

ul{
列表样式类型：无；
保证金：0；
填充：0；
溢出：隐藏；
背景色：#333；
}
李{
浮动：左；
}
李安，.dropbtn{
显示：内联块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
}
li a:悬停，.下拉：悬停.dropbtn{
背景色：红色；
}
li.下拉列表{
显示：内联块；
}
.包装纸{
显示：无；
位置：绝对位置；
背景色：#f9f9f9；
最小宽度：160px；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
z指数：1；
}
.下拉内容a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
文本对齐：左对齐；
}
.下拉内容a:悬停{背景色：#f1f1}
.下拉列表：悬停.包装器{
显示器：flex；
证明内容：中心；
}

第二个分区在哪里？不要向我们展示原始代码，然后含糊不清地说出您所做的更改，而是向我们展示导致问题的更改代码。您能否创建一个或一个，以便每个人都可以调试并查看您所编写的程序？如果您只是在同一位置添加了第二个元素，其中包含类

下拉内容

，当然会发生这种情况，因为这些元素是绝对定位的。您可能更应该在该类的现有元素中添加元素，以获取在两列中显示的单个元素中的内容。所以请检查我的代码，告诉我哪里错了。谢谢大家!@如果代码对您有效，请向上投票并突出显示接受答案的勾号。这就是所有人的工作原理。：）