html - 相対的な行の高さでテキストエリアに行を表示する方法は?

Question

誰かがこの問題を解決してくれるかもしれません: テキストエリアに行を表示する JavaScript を使用しないソリューションを探しています。ここで受け入れられた答えは、ボックス内の固定の行の高さに依存するため、うまくいきません。

私のテキストエリアは次のようになります。

textarea{
  line-height: 2em;
}

そのため、画像のみのソリューションは機能しません。それをアーカイブできる何か、おそらくCSS3関連のものはありますか? 私はもう試した

background: url('whitepx.png') repeat left 2em #363636;

しかし、それはテキストエリア全体を白くします。

---

アップデート

私はそれを手に入れたと思います。私の質問を十分に明確にできなかった場合は申し訳ありません。

これは最終的に私のcssです：

textarea
    {
    width: 100%;
    background-color: #363636;
    border: 1px solid #fff;
    outline: none;
    color: #fff;
    font-size: 14px;
    display: block;
    padding: 0 0 0 1em;
    line-height: 2em;
    font-family: sans-serif;
    resize: none;
    height: 58em;
    width: 530px;
    background-image: -moz-repeating-linear-gradient(#363636, #363636 20%, #fff 22%);
    background-image: -webkit-repeating-linear-gradient(#363636, #363636 20%, #fff 22%);
    background-image: -o-repeating-linear-gradient(#363636, #363636 20%, #fff 22%);
    background-image: -ms-repeating-linear-gradient(#363636, #363636 20%, #fff 22%);
    background-image: repeating-linear-gradient(#363636, #363636 20%, #fff 22%);    
    background-size: 100% 2em;
    background-attachment: local;
}

このフィドルを参照してください。私には十分に見えます。