css

css

gridで横並びのコンテンツを上下中央で配置する方法

基本的にコンテンツを横並びにする場合はflexを使用して実装しますがflexではどうしても再現できないパターンがあります。 そんな時はgridで再現する方法がありますが、gridで横並びを作ると高さが画面幅に合わせて変化するコンテン...
css

余白のサイズを画面サイズに合わせて滑らかに変更したい時

デザイナー:このデザイン通りコーディングお願いします エンジニア:これ、画面幅縮めると文章が改行されますけどいいですか? デザイナー:ダメで...
css

電話番号を書く際のおすすめの書き方

電話番号をwebサイトに記載する場合、どのようなタグで囲み、書いていますか? タグによってはブラウザ判断で意図しないスタイルが当たってしまったり、そのスタイルを上書きできないという場面があったりします。 電話番号はaタグ+h...
css

calcの計算式のルールcalcが使えない時は単位に気を付けろ

フォントサイズや余白のサイズを計算して指定することができるcalc。とても便利ですよね。 calcを使えば横幅を3つに均等に分けたい時など、33.33...%と割り切れない数字を100% / 3と書いたり、画面幅に合わせて幅を変更した...
css

レスポンシブに合わせて一定の範囲内でフォントサイズを変更する方法

画面サイズを変化させた時のフォントサイズの挙動について考えつつも、後回しにていたのですが、twitterで以下の記事が目に止まったのでこれを気に勉強しようと思いました。 ですが僕は、数学がすごく得意なわけではないので理解度が足...