]line-heightのアセンダとディセンダの余白を疑似要素でネガティブマージンして包含ボックスのcontent edgeに合わせるmixinを作ってくれる

o_ti のブックマーク 2018/04/03 18:33

<blockquote class="hatena-bookmark-comment"><a class="comment-info" href="https://b.hatena.ne.jp/entry/360922364/comment/o_ti" data-user-id="o_ti" data-entry-url="https://b.hatena.ne.jp/entry/text-crop.eightshapes.com/" data-original-href="http://text-crop.eightshapes.com/" data-entry-favicon="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Ftext-crop.eightshapes.com%2F" data-user-icon="/users/o_ti/profile.png">EightShapes Text Crop</a><ul class="comment-tag" style="list-style: none; margin: 0px;"><li style="float: left">[<a href="https://b.hatena.ne.jp/q/CSS">CSS</a>]</li><li style="float: left">[<a href="https://b.hatena.ne.jp/q/%22CSS%20line-height%22">CSS line-height</a>]</li><li style="float: left">[<a href="https://b.hatena.ne.jp/q/%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AC%E3%83%BC%E3%82%BF%E3%83%BC">ジェネレーター</a>]</li><li style="float: left">[<a href="https://b.hatena.ne.jp/q/Sass">Sass</a>]</li></ul><br><p style="clear: left">]line-heightのアセンダとディセンダの余白を疑似要素でネガティブマージンして包含ボックスのcontent edgeに合わせるmixinを作ってくれる</p><a class="datetime" href="https://b.hatena.ne.jp/o_ti/20180403#bookmark-360922364"><span class="datetime-body">2018/04/03 18:33</span></a></blockquote><script src="https://b.st-hatena.com/js/comment-widget.js" charset="utf-8" async></script>

このブックマークにはスターがありません。
最初のスターをつけてみよう！

EightShapes Text Crop

text-crop.eightshapes.com2018/03/24

@mixin text-crop($line-height: 1.3, $top-adjustment: 0px, $bottom-adjustment: 0px) { // Configured in Step 1 $top-crop: TOPCROP; $bottom-crop: BOTTOMCROP; $crop-font-size: FONTSIZE; $crop-line-heig...

10 人がブックマーク・1 件のコメント

他のコメントを読む

＼コメントがサクサク読めるアプリです／

はてなブックマーク

EightShapes Text Crop

はてなブックマーク

公式Twitter

はてなのサービス