cssコーディングをしていて、インライン要素に背景色をつけた。
文字列に背景色をつけるが、改行すると改行箇所だけ
余白がなくなる
上記の例では、「箇所だけ」の後と「余白が」の前にpaddingがゼロになっている。
デザイナーから何とかならないかと言われていろいろググって、やり方を見つけたのでメモメモ。
-----
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
-----
これを付与することでできるらしい。
※ブラウザ対応状況がまだ十分ではないので、webkit用のベンダープレフィックスも追加。
文字列に背景色をつけるが、改行すると改行箇所だけ
余白がなくなる
----------
角丸にしたときなんかの
効き方もこんな感じ
↓↓
角丸にしたときなんかの
効き方もこんな感じ