我怎样才能让我的 css 隐藏一个破坏它的溢出？

Question

我创建了一个 css，它看起来像这样：

但是当我想应用 overflow : hidden（以便在每个单词上有一个省略号）时，它取消了我的风格。

我创建了一个 example 给你看。我只是将 class overflow 添加到 anchor 并应用 overflow : hidden.

我想知道如何才能保持第一张图片的风格，并且每个单词都有省略号。

Answer 1

尝试从 - .nav ul li a.

中删除 "position: relative"

Answer 2

我做了这个css！不要在标签之前和之后应用！

.nav ul li:nth-child(2):before {
z-index: 1;
position: absolute;
top: 0;
left: -15px;
content: '';
width: 0;
height: 0;
display: block;
border-right: 15px solid #FFFFFF;
border-top: 60px solid transparent;
}

  .nav ul li:nth-last-child(2):after {
position: absolute;
z-index: 1;
top: 0;
right: -15px;
content: '';
width: 0;
height: 0;
display: block;
border-left: 15px solid #FFFFFF;
border-bottom: 60px solid transparent;
}

我怎样才能让我的 css 隐藏一个破坏它的溢出？

How can I keep my css with an overflow hidden which broke it?

css

overflow