Html 使父级的伪边界中断并溢出：auto

我正在尝试创建一个水平/滚动导航，每一端都有渐变淡入。将父级设置为

溢出：auto

几乎解决了我的问题，但隐藏了我的活动链接边框，我将其定位为父级链接上方的

：before

pseudo。我想知道是否有一种方法可以让我的伪边界在溢出时保持溢出？对于这个问题，梯度本身并不重要，但这个结构需要保持机智

ul{
保证金：0；
}
李{
显示：内联块；
}
.垂直标题{
高度：55px；
边缘底部：13px；
边框底部：3px实心#dceaec；
字体大小：22px；
线高：57px；
颜色：#111；
文本对齐：居中；
文本转换：大写；
}
.垂直标题包装{
填充：0；
z指数：0；
位置：相对位置；
}
.枢纽导航{
显示：块；
填充：0 15px；
宽度：100%；
z指数：1；
空白：nowrap；
溢出：自动；
}
.轮毂导航链路{
位置：相对位置；
}
.hub导航链接。活动路径：之前{
内容：“；
显示：块；
高度：3倍；
宽度：100%；
左：0；
位置：绝对位置；
顶部：-16px；
背景色：#007eff；
}

以下内容

负边距可以达到以下效果：

ul{
保证金：0；
}
李{
显示：内联块；
}
.垂直标题{
高度：55px；
边缘底部：13px；
边框底部：3px实心#dceaec；
字体大小：22px；
线高：57px；
颜色：#111；
文本对齐：居中；
文本转换：大写；
}
.垂直标题包装{
填充：0；
z指数：0；
位置：相对位置；
}
.枢纽导航{
显示：块；
填充：0 15px；
宽度：100%；
z指数：1；
空白：nowrap；
溢出：自动；
填充顶部：16px；
利润上限：-16px；
}
.轮毂导航链路{
位置：相对位置；
}
.hub导航链接。活动路径：之前{
内容：“；
显示：块；
高度：3倍；
宽度：100%；
左：0；
位置：绝对位置；
顶部：-16px；
背景色：#007eff；
}

以下内容

负边距可以达到以下效果：

ul{
保证金：0；
}
李{
显示：内联块；
}
.垂直标题{
高度：55px；
边缘底部：13px；
边框底部：3px实心#dceaec；
字体大小：22px；
线高：57px；
颜色：#111；
文本对齐：居中；
文本转换：大写；
}
.垂直标题包装{
填充：0；
z指数：0；
位置：相对位置；
}
.枢纽导航{
显示：块；
填充：0 15px；
宽度：100%；
z指数：1；
空白：nowrap；
溢出：自动；
填充顶部：16px；
利润上限：-16px；
}
.轮毂导航链路{
位置：相对位置；
}
.hub导航链接。活动路径：之前{
内容：“；
显示：块；
高度：3倍；
宽度：100%；
左：0；
位置：绝对位置；
顶部：-16px；
背景色：#007eff；
}

以下内容

不幸的是，如果下面有内容，这将不起作用。@CarlEdwards我用下面的内容更新了代码示例。一切看起来都很好，到底是什么不起作用？我错了。我的原始代码有一个显式的高度设置。移除后，我让它开始工作。谢谢不幸的是，如果下面有内容，这将不起作用。@CarlEdwards我用下面的内容更新了代码示例。一切看起来都很好，到底是什么不起作用？我错了。我的原始代码有一个显式的高度设置。移除后，我让它开始工作。谢谢