Javascript 如何修复覆盖内容的引导下拉列表？

我有一个引导下拉按钮，我想在页面的右侧定位

下拉列表应为页面宽度的100%，并且在激活时应覆盖页面上的任何内容。然而，我有一个大的标志定位在我的下拉按钮的左侧，我希望用户能够点击它将他们带回主页。不幸的是，此徽标的一部分被引导按钮覆盖

.下拉列表{
位置：绝对位置；
z指数：99；
宽度：100%；
顶部：100px；
}
.下拉开关{
右边距：50px；
}
.下拉菜单{
文本对齐：居中；
z指数：999；
宽度：100%；
}
.下拉项{
填充：0.75雷姆1.5雷姆；
宽度：100%；
}

您可以限制下拉列表的区域以更改其宽度

.标志容器{
宽度：300px；
高度：300px；
溢出：隐藏；
}
.标志{
背景色：黑色；
宽度：100%；
身高：100%；
}
.下拉列表{
位置：绝对位置；
z指数：99；
宽度：计算（100%-320px）；
顶部：100px；
右：0px；
}
.下拉开关{
右边距：50px；
}
.下拉菜单{
位置：绝对位置；
文本对齐：居中；
z指数：999；
宽度：计算（100%+320px）；
}
.下拉项{
填充：0.75雷姆1.5雷姆；
宽度：100%；
}

要将其放置在徽标下方吗？不，我希望下拉列表和徽标放置在同一位置我希望下拉列表的宽度始终为100%，但这个答案无论如何都不起作用，链接图像仍有一部分被阻止。哦，现在我得到了您想要的，抱歉。我已经修复了代码片段。这仍然没有解决我的问题，徽标链接现在已经遍布整个页面