横長の要素にoverflowが効かない問題
コーダーのオッコです。
カレンダーをスマホで横スクロールにしたかったのですが、カレンダーの横幅のcssを以下のように書いてもはみ出す問題がありました。
width: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
もう既に背景がくずれてますが、これ↓を横スクロールすると
こうなります。
原因は、「横長の要素にflexが効いているとoverflowが効かないこと」でした。
参照：Flex item の overflow: hidden が効かない問題の対処方法
カレンダーに
min-width:0;
を入れて解決しました。
関連記事紹介
システム開発はアピステクノロジーへ
アピステクノロジーでは、システム開発をはじめ、システムパッケージの販売にも力を入れています。
「IT TOOL」をご存じですか？
既に標準の機能が実装されているシステムパッケージを、貴社用にデザインカスタマイズし提供します。
さらに、IT導入補助金の利用で価格を大きく抑えることも可能です。
実績多数、低価格で本格的なサイトができると好評いただいております。
詳しくは弊社HPをご覧ください。
アピステクノロジーの実績紹介はこちら
ITツール紹介ページはこちら
