2022-01-01から1年間の記事一覧
こんな感じでテキストの横にラインが幅いっぱい引かれるパターン <div className='flex items-center space-x-1'> <span className="text-gray-500">タグ</span> <div className="flex-1 border-b border-gray-500"></div> </div> 地方・田舎に住む男性と地方・田舎へ嫁ぎたい・移住したい女性専門の結婚相談所・お見合い・婚活サービスは【田舎婚】 【ヲタ婚】
こんな感じでクリックするとアイコンが広がりボタンになるアニメーション 1度目のクリックでボタンになり、2度目のクリックで処理が実行されるので、確認ダイアログよりスマートな操作となる。
一緒にアニメ・ゲームを楽しめるパートナーを探すなら【ヲタ婚】 1年以内の成婚率41.3%! 平均6.6ヶ月で婚約できるスマホの結婚相談所【naco-do】 選ばれて10年。エンジニアの気持ちが分かる転職エージェントは【アイムファクトリー】 こんなやつ ソース ※Re…
Tailwindで画面中央に配置したい場合 h-screen w-screen flex justify-center items-center を使うことが多いと思いますが、親要素ですでにh-screenを指定していると場合によって画面以上になってしまいます。 そんな場合は absolute inset-0 flex items-cen…
このように左端に戻るボタンがあっても、タイトルをセンターに表示したいときは下記でOK 戻るbuttonタグにabsoluteを付ける タイトルのh1タグの幅をw-fullにする 【ヲタ婚】 1年以内の成婚率41.3%! 平均6.6ヶ月で婚約できるスマホの結婚相談所【naco-do】 <div className="flex top-0 sticky text-white"> </div>