css - IE9 の CSS 上パディング

Question

以下のようなCSSがあります。

.ui-icon {
    font-size: 6em;
   height: 180px;
   width: 180px;
}

.ui-icon .ui-icon-label {
    padding-top: 15%;
}

上部パディングは IE9 のテキストを表示しません (つまり、ui-icon-label)。

HTML も以下に示します。

<div class="ui-icon-color ui-icon">
<div id="icon-1">
<i class="icon-cog"></i>
</div>
<div class="ui-icon-label">My Label</div>
</div>

しかし、同じコードが Chrome と Firefox でうまく機能します。IE9 は、パディングが 13.4% になるまで ui-icon-label を表示します。値まで、徐々に大きくすると、テキストが少し下に移動します。その値を超えると、突然消えます。しかし、私にとっては、ラベルを配置するのに最適な位置は 15% に見えます。「clear:both」や W3C バリデーターの使用など、提案で提供されているさまざまなソリューションを試しました。しかし、彼らは助けにはなりませんでした。

参考までに、icon-cog クラスは font-awesome から来ています。