Webデザイン
2021.6.6
以前も書いてみたのだけど、新しいデザインで書いてみました。
CSSは最低限html、body、aにだけ当てました。
何年振りでtableレイアウトを利用して懐かしかったです。
そして2度と書きたくないです。
そんな、サンプルはこちら
Internet Explorの終焉に寄せて。
※サンプルをスマホで見ると崩れまくります。
以前も書いてみたのだけど、新しいデザインで書いてみました。
CSSは最低限html、body、aにだけ当てました。
何年振りでtableレイアウトを利用して懐かしかったです。
そして2度と書きたくないです。
そんな、サンプルはこちら
Internet Explorの終焉に寄せて。
※サンプルをスマホで見ると崩れまくります。
米国Microsoftは5月19日(現地時間)、Windows 10におけるInternet Explorer 11のサポートを2022年6月15日に終了すると発表しました。
参考記事:Internet Explorerが2022年6月15日にサポート終了、ただしEdgeのIEモードは2029年までを予定
IEをご存じなの?
うんざりするほどね。時には「味方」、時には「敵」、「恋人」だったこともあったかな。
彼、生まれつきの独自仕様よ。気をつけてね。
捨てられたの?
まさか。捨てたの。
※この記事は2013年10月のエントリーを再編集・再掲載しています。
HTML
<div class="line-height">ABCDEFG</div>
line-height が効かない CSS
body {
font-family: "ヒラギノ角ゴ Pro W3", "小塚ゴシック Pro R", "メイリオ", "MS Pゴシック", "Hiragino Kaku Gothic Pro", "KozGoPro-Regular", "Meiryo", "MS PGothic", "MS UI Gothic", Osaka, sans-serif;
}
.line-height {
background-color: #ffffe6;
color: #ef0001;
height: 30px;
line-height: 30px;
margin-top: 50px;
overflow: hidden;
text-align: center;
}
line-height が効くCSS
body {
font-family: "メイリオ", "MS Pゴシック", "小塚ゴシック Pro R", "ヒラギノ角ゴ Pro W3", "Meiryo", "MS PGothic", "KozGoPro-Regular", "Hiragino Kaku Gothic Pro", "MS UI Gothic", Osaka, sans-serif;
}
.line-height {
background-color: #ffffe6;
color: #ef0001;
height: 30px;
line-height: 30px;
margin-top: 50px;
overflow: hidden;
text-align: center;
}
font-family指定で一番初めに”メイリオ”を指定していない場合、line-heightが効かないことがあるようです。font-familyの指定を見てみましょう。