css - 在 Foundation 4 css h1 首字母文本转换大写导致顶部栏 h1 名称中缺少字母

Question

我添加的自定义 CSS 允许 H1 中的第一个字母在任何地方大写，这使得标题以 XYZ 开头的顶部栏的第一个字母“X”消失。

我没有成功尝试过：

.topbar:first-letter {
  text-transform: none !important;
}

.top-bar .name {
  text-transform: none !important;
}

---

<nav class="top-bar">
  <ul class="title-area">
    <!-- Title Area -->
    <li class="name">
      <h1><a href="#"class="home" title="XYZ Business Lobby">XYZ Business Lobby</a></h1>
    </li>
    <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon        `enter code here`alone -->
    <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
 </ul>

见小提琴。