text-indent -99999px を使わないで空白を維持する方法？

2019/1/6 HTML5

サイト制作でコーディング途中に、スペースを作る時ってありますよね？
でも、

<div class=""></div>

と記入して div ブロックに空白を作るのはあまりおすすめも出来ず、結局は

<div class="">あいうえお</div>

と記述して、div 要素にスタイルシートで text-indent: -99999px; と記入するケースになるのではないでしょうか？
　
そこで解決方法を一つご紹介します。
　
コードはこちら。。。

.sample {
   width: 100%; 
   height: 1rem;
   text-indent: 100%;
   white-space: nowrap;
   overflow: hidden;
}

　
上記の記述でtext-indent: -99999px;の代わりとなる空白を作ることが可能です。
height に空けたい高さのスペース値を入れてください。