Twitter ウィジェットが広がって、横スクロールバーが表示される

Twitter

Twitter の公式ウィジェットをサイトに掲載して、iPhone (iOS 12.4) の Safari で見てみると、Twitter ウィジェットの横幅が画面の横幅を超えてしまい、横スクロールバーが表示されてしまいました。

この現象は iOS の Safari 特有のバグのようで、iframe のスタイルに width: 100% が指定されていると発生します。

そこで twitter-timeline クラスに width: 740px !important を指定して、幅を強制的に 740 px にします。ただし、max-width: 100% が指定されているので、この固定幅 (740 px) になることはありません。

.twitter-timeline { width: 740px !important; }

Mac の Safari や、Android の Chrome では発生しません。

早く iOS の Safari のバグが修正されるといいですね。

Comments

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です