フォーラムへの返信
-
あーどうも「流体タイポグラフィ」を有効化すると、干渉して、読み込み順によっては「流体タイポグラフィ」がデフォルトで持っているフォントサイズのほうが優先されてしまい、小さくなってしまうということがおこりえるみたいです。
僕の環境だと「流体タイポグラフィ」の CSS が先に読まれるから上書きされて小さくならなかったみたいです。流体タイポグラフィの CSS を弱める変更を入れようと思います。できたらまた書き込みます！
いいねをした人：僕の開発環境でテストしてみました。
↓の画像の上側が 100px のカスタムフォントサイズ、下側が 50px〜100px のカスタムフルード値を設定したものです。
ちゃんと反映されていて、HTML 上に下記の CSS が出力されていました。
--wp--preset--font-size--custom-1: 100px; --wp--preset--font-size--custom-2: clamp(50px, 3.125rem +((1vw - 3.2px)* 4.931), 100px);公開側の画面で適用されなくなったということは、何らかの CSS で上書きされてしまっているか、何らかの原因で上記のような CSS が出力されなくなっている可能性があるのかなと思います。その辺確認してみてください！
もし URL を共有いただけるならこっちでも見てみます。
いいねをした人：僕の環境だと、下記の画像のようにフォーム自体は横いっぱいに広がります。
が、テキストフィールドやテキストエリアはデフォルトが幅100%ではないため、フォームの幅までは広がりませんでした。Contact Form 7 に詳しくないのでどう調整するのがベストかはわからないのですが、Contact Form 7 にテキストフィールドやテキストエリアのサイズを設定する項目があればそれで設定、なければ CSS で
width: 100%を追加する、のようなカスタマイズが必要になるのかなと思います。そもそもフォーム自体も横いっぱいに広がらないということであれば、使っているテンプレートとか追加している CSS が影響しているとか色々可能性が考えられるので、実際のページの URL をここで共有して直接見せていただければと思います。
いいねをした人：
