它坏了是因为你的代码无效。你不能像这样嵌套CSS选择器：

.podmenu:hover {
    .verze {
        display: flex;
    }
}

你要这样写：

.podmenu:hover .verze {
    display: flex;
}

现在试试下面的例子：

.podmenu {
  display: flex;
  flex-direction: column;
  list-style: none;
  width: 10rem;
  margin-left: 3rem;
  margin-bottom: 60px;
}

.verze {
  list-style: none;
  flex-direction: column;
  display: none;
  margin-top: 1rem;
  transition: 2s;
  margin-left: -2.94rem;
}

.podmenu:hover .verze {
  display: flex;
}

<ul class="podmenu">
  <li class="n">Verze</li>
  <li>
    <ul class="verze">
      <li class="wind"><a href="windows1.html">Windows 1.0</a></li>
      <li class="wind"><a href="windows2.html">Windows 2.0</a></li>
      <li class="wind"> <a href="windows3.html">Windows 3.0</a></li>
      <li class="wind"><a href="windows95.html">Windows 95</a></li>
      <li class="wind"><a href="windows98.html">Windows 98</a></li>
      <li class="wind"><a href="windowsn.html">Windows NT</a></li>
      <li class="wind"><a href="windows20.html">Windows 2000</a></li>
      <li class="wind"><a href="windowsx.html">Windows XP</a></li>
      <li class="wind"><a href="windowsv.html">Windows Vista</a></li>
      <li class="wind"> <a href="windows7.html">Windows 7 </a></li>
    </ul>
  </li>
</ul>

.podmenu:hover {
    .verze {
        display: flex;
    }
}

问题是你正在嵌套CSS选择器，在过去的20年里，在大多数浏览器中，这是无效的语法，会导致CSS解析器中止并忽略样式规则的其余部分。嵌套选择器是CSS预处理器（如Sass/SCSS）的一个功能，但它们的工作原理是将嵌套转换为一个扁平的样式规则序列。

然而，有a new specification，增加了在CSS中嵌套选择器的能力，大多数浏览器供应商都同意实现。Chromium是第一个在版本112中添加CSS嵌套支持的浏览器引擎。Safari在版本16.5中增加了对CSS嵌套的支持。至于Firefox，在我写这篇文章的时候是they're still working on it。这就是为什么嵌套语法目前在Chromium中有效，但在Firefox中无效（尚未）。

• 注意 *：原生CSS嵌套与Sass/SCSS嵌套不完全相同;有一些细微的语法和语义差异，您可以在规范中阅读更多有关这些差异的信息。

要使CSS当前支持包括Firefox在内的所有浏览器，您需要像这样展平嵌套：

.podmenu:hover .verze {
    display: flex;
}