将一个文本放在另一个文本上方 - html＆amp; CSS

Question

我正在尝试将文字放在另一条文字线上

Test
Upgrade

我的html和css似乎没问题，但它的位置就像

Test Upgrade

我的代码有什么问题？

＆＃13;

＆＃13;

.upgrade {
  display: inline-block;
}

＆＃13;

<li>
  <div class="upgrade">
    <a href="" class="nav-link dropdown-user-link">
      <span class="user-name">Upgrade</span>
    </a>
  </div>

  <div class="upgrade">
    <a href="" class="nav-link dropdown-user-link">
      <span class="user-name">Test</span>
    </a>
  </div>

</li>

＆＃13;

＆＃13;

＆＃13;

enter image description here

Answer 1

将升级类中的显示属性更改为阻止

.upgrade {
display: block;
}

Answer 2

显然你对显示类型“inline-block”感到困惑，这会让你的文字以你不想要的方式出现。

获得所需结果的方法可以是“display：block”。

检查显示选项列表here