确保同一类的所有 div 的大小均为最大的 div

Question

所以我得到了一些 div，像这样：

<div class="personal-events-list">
    <div class="specific-event black-font">Something</div>
    <div class="specific-event black-font">Something else</div>
    <div class="specific-event black-font">Something more</div>
</div>

我希望它们具有相同的大小（假设有意义的是最大的大小），如下所示： https://i.stack.imgur.com/XxgzK.jpg

目前我有这样的东西： https://i.stack.imgur.com/TZmKt.jpg

目前我有带有“width: fit-content”的CSS，但这只会使它们的尺寸不同。我想出的唯一真正的解决方案是使它们全部固定大小，例如“宽度：300px”，但这会使一些更大/更小的名称看起来有点时髦......有没有办法做我想要的事情？

非常感谢您的宝贵时间！

编辑 1：添加 CSS

.specific-event {
  width: fit-content;
  margin-bottom: 10px;
  text-decoration: none;
  color: black;
  padding: 5px 10px;
  background-color: #d1d1d1;
  border-radius: 8px;
}

.specific-event:hover {
  background-color: #9c9c9c;
  color: white;
}

Answer 1

尝试将 width: fit-content 添加到 .personal-events-list 而不是 .special-event

像这样：

.specific-event {
  margin-bottom: 10px;
  text-decoration: none;
  color: black;
  padding: 5px 10px;
  background-color: #d1d1d1;
  border-radius: 8px;
}

.specific-event:hover {
  background-color: #9c9c9c;
  color: white;
}

.personal-events-list {
  width: fit-content;
}

    
Something
    
Something else
    
Something more