2018年04月3日(火)

[CSS]文字に含まれる上下の余白を取り除いて、アイコンや画像とぴったり同じ高さにするスタイルシート

• 0
• 318
• 78
• 255

@mixin text-crop($line-height: 1.3, $top-adjustment: 0px, $bottom-adjustment: 0px) {

    // Configured in Step 1

    $top-crop: 9;

    $bottom-crop: 8;

    $crop-font-size: 36;

    $crop-line-height: 1.2;

    // Apply values to calculate em-based margins that work with any font size

    $dynamic-top-crop: max(($top-crop + ($line-height - $crop-line-height) * ($crop-font-size / 2)), 0) / $crop-font-size;

    $dynamic-bottom-crop: max(($bottom-crop + ($line-height - $crop-line-height) * ($crop-font-size / 2)), 0) / $crop-font-size;

    // ...