CSSで文字の高さを調節する。
文字の位置を調整するのはいつだって苦労する。
特に、縦の位置を揃えるのは難題だ。
今回、色々やってみて「おっっ」と思ったTIPSがあったのでメモっておこう。
たとえば「お名前必須」というブロックがあったとして。
高さ、あいませんやん。
それを
「お名前必須」にする、みたいな。
つまりこれはね。
1 2 3 4 5 6 7 8 9 10 11 |
span.hoge { background:#ff9900; border-radius: 4px;color:#fff; display:inline-block; font-size:60%; margin-left:5px; padding:1px 3px; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.4); position:relative; top:-4px; } |
って感じで、ポジションをつけてあげて、トップからの高さで引っ張ってきたって感じ。
背景つけたいからパディングを設定している訳で、動かすところはもうそこしかない。
これって自分的には大発見。きっと色んなとこに載ってるんだろうけど。。。
動いてるよーぐると。