Html 我的芯片卡文本超出了小尺寸的限制

.chip{
显示：内联块；
填充：0 25px；
高度：50px；
字号：18px；
线高：50px；
边界半径：25px；
背景色：#f1f1；
}
.chip-img{
浮动：左；
利润率：0.10px 0-25 px；
高度：50px；
宽度：50px；
边界半径：50%；
}
.关闭{
左侧填充：10px；
颜色：#888；
字体大小：粗体；
浮动：对；
字体大小：20px；
光标：指针；
}
.closebtn:悬停{
颜色：#000；
}

无名氏超长文本
&时代；

使用

flex

.chip {
  display: inline-flex;
  padding: 0 25px;
  font-size: 18px;
  align-items:center;
  border-radius: 25px;
  background-color: #f1f1f1;
}

.chip img {
  margin: 0 10px 0 -25px;
  height: 50px;
  width: 50px;
  border-radius: 50%;
}

.closebtn {
  padding-left: 10px;
  color: #888;
  font-weight: bold;
  
  font-size: 20px;
  cursor: pointer;
}

.closebtn:hover {
  color: #000;
}

---

谢谢您的回复。我接受了答案。顺便说一句，你能编辑JSFIDLE上的代码吗？x是以x为背景的，关于自动生成的x的字体大小