2021年11月4日のブックマーク (2件)

  • CSSで、button要素とinput要素のテキストを美しく揃えるスタイルシートのテクニック

    検索フォームなど、button要素とinput要素を並べて配置した際に、それらのテキスト(アイコンも)を垂直方向に美しく揃えて配置するスタイルシートのテクニックを紹介します。 ボタンと入力フォームの高さは自由に変更でき、デザインも普通に変更できるので、スニペットとして登録しておくと便利です。 button要素とinput要素のテキストを揃える インタラクティブな要素のコンテンツを垂直方向に揃えるのに苦労したことはありませんか? あなたは仲間です、多くの人が経験していると思います。 この記事では、line-height, padding, flexboxを使用して、button要素とinput要素のコンテンツを中央に配置する方法について解説します。 まず、ゴールを明確にしておきましょう。 button要素とinput要素のコンテンツは完璧に揃えます。 button要素とinput要素の高さは

    CSSで、button要素とinput要素のテキストを美しく揃えるスタイルシートのテクニック
    karupopo
    karupopo 2021/11/04
    CSS ボタン配置
  • 【CSS display:flex】フレックスボックスの使い方

    PICK UP A8フェスティバルオンラインセミナーで「売れるサイトmakerに聞く!サイト作成スタートアップガイド」というテーマでセミナー講師としてお話しさせていただきました。 個別指導Webスクール 個人事業主様・経営者様・起業副業など自分のビジネスのためにホームページの作り方を習得するスクール

    【CSS display:flex】フレックスボックスの使い方
    karupopo
    karupopo 2021/11/04
    CSSボタン配置