search

kip2 / my-website

my website repository.
0 stars 0 forks source link

Topページのquotableタイトル「Maxim」のスマホ表示が崩れる件 #1

Closed moritanuki closed 4 months ago

moritanuki commented 4 months ago

概要

楽しい仕掛けがいっぱいのWebサイトだったので思わず見入ってしまいました...。 本件ですが、スマホだと画像のようにTOPページのみh1要素が右横にはみ出してしまっています。 （他のページでは同事象は見受けられず。コードも同様に他の <h1> で対策しているのは文字サイズだけの模様。） image

提案

レスポンシブ用にCSSを付けているように思えたんですが、意外と何も指定しない方がスッキリ収まる気がしました。

<h1 className='mx-auto text-center text-5xl font-serif italic'>
    Maxim
</h1>
kip2 commented 4 months ago

ご指摘ありがとうございます！ CSS難しい＆レスポンシブ難しすぎていつも枕を濡らしておりますので、ご指摘＆ご提案いただいてとても助かります！

さて、ご提案の修正内容で問題ないことを実地で確認しましたので、ご提案の内容を取り入れて本件クローズいたしました。

また、修正時に、コンポーネント名が画面表示の名前と異なっていることも見つけましたので、そちらも修正しました。 修正前：コンポーネント名「Quetes」 -> 画面表示「Maxim」 修正後：コンポーネント名「Maxim」 -> 画面表示「Maxim」