Html 增加图标大小会破坏大屏幕上的引导布局

我正在用bootstrap制作一个面板，遇到了一个问题

这是现在的面板（）：

所有内容都定位正确，但图标有点小，因此我在图标元素中添加了以下css规则：

.t-22{
    font-size:22px;
}

但是，执行此操作后，我的布局会发生移动，最后一个输入组会向右拉，如下所示：

css（）后面的面板

为什么在我将图标变大时，我的最后一个元素会被向右拉，尽管看起来有足够的空间放置更大的图标？

如何在不破坏布局的情况下使图标大小为22px？

---

我有一个大屏幕，这就是它的外观。即使我降低视口，它仍能正确显示元素。

您需要更改图标的线条高度，它位于

线条高度：31.4286px并且您的文本是
行高：20px

请参阅示例代码段。
。无包裹标签标签{
空白区：nowrap！重要；
}
.t-22{
字体大小：22px；
线高：22px；
}

标题
开始时间
帐号
帐号
帐号
帐号
最后
下一个
我的本地服务器上没有提取元素。@LuckyChingi您使用的浏览器是什么？我在macff41.0.2和chrome46.0.2490上使用chrome和firefox。80@LuckyChingi你有没有把屏幕拉伸到只有一个元素在最下面一行？哇，真奇怪。谢谢，我上班的时候会检查一下，也许这只是发生在Mac电脑上，奇怪的是你太棒了！这让我快发疯了！