hamlでビューの編集中にイラっとすることがあったので、その解決法です
現象とコード
一言で言えば、隙間がすごく気になっただけです。
1️⃣編集前
sample.html.haml
平均値を超えた数値は赤くなります
これを編集して「赤く」の部分の文字色を赤くしようと思いました。
2️⃣編集後
sample.html.haml
平均値を超えた数値は
%span{style: "color: red"} 赤く
なります
spanタグで color: red を当てたところ
あら?
思っていたのと違う。
編集前 | 編集後 |
---|---|
![]() |
![]() |
marginやpaddingを当てたわけじゃないのに隙間が空いた。
どうやらhamlの仕様で改行したことによって隙間が生じたみたいです。
3️⃣対策後
sample.html.haml
平均値を超えた数値は
%span{style: "color: red"}> 赤く
なります
spanタグに「>」をつけただけで直りました。
どうやら、「>」はタグの外側の隙間を埋めて、「<」はタグの内側の隙間を埋めてくれるようです。
早い話が、両方つけておけばOKみたいです。