投稿一覧
flexboxの救世主「gap」プロパティが左寄せデザインに超便利！
突然ですが、以下のようなレイアウトを作るとき、どのような実装をしますか？
3列の横並びボックス間のマージンは10px改行すると左寄せ下部にはマージンは必要なし
flexを利用する方法、いくつか思いつきますよね。
でも、gapプロパティを利用すれば簡単に実装できちゃうんです。
すぐに確認したい方は目次から「gapプロパティを使用しましょう」のアンカーリンクをクリック
Web制作
2022.11.11
SafariやChromeで表示が異なるボタンやセレクトタグを初期化して装飾しよう
ボタンやチェックボックスをCSSで装飾せずにデフォルトのままで使用していませんか？
実はこれらのタグ、デフォルトで当たっているスタイルが各ブラウザで異なるんです。
iPhoneのSafariだと少し使いづらいなんて声もよく耳にします。
ボタンやチェックボックスに対してCSSを当てて全てのブラウザで見た目を統一させる方法を紹介いたします！
各ブラウザでのデフォルトの表示
Web制作
2022.11.09
【構造化データ】見た目だけじゃない「よくある質問（FAQ）」の作り方
構造化データの実装とともにアコーディオン型のよくある質問（FAQ）の作り方を紹介します。
まずは見た目から
早速ですがよくある質問の作り方を紹介します。
よくあるアコーディオン型のFAQです。summaryやdetailsタグを使用した実装方法もありますが、CSSやJavaScriptで装飾、操作のカスタマイズが面倒なのでdivタグで作っております。
See the
Web制作
2022.11.06
【テスト工程】Webサイト納品前のチェックリストを大公開！
Web制作での品質管理。皆さんはどうしてますでしょうか？
Webサイト納品前の大事な工程「テスト」。チェックリストを公開します。
表示崩れはないか
Webサイトに重要な要素「デザイン」。
制作現場ではデザインを基にコーディングするのが一般的です。
そしてそのコーディングがデザイン通り、もしくはデザインに則った形になっているかどうかをチェックします。
画像や文字
Web制作
2022.11.02
