タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

スクロールとテーブルに関するcometnoteのブックマーク (1)

  • はみ出たtableを横スクロールで滑らかに表示するCSS - Qiita

    table { display: block; overflow-x: scroll; white-space: nowrap; -webkit-overflow-scrolling: touch; } 2行目: 隠れた部分をx方向(=横)にスクロールして表示する 3行目: 自動で改行しない(←必要であれば) 4行目: スマホで滑らかにスクールする ただ、セルの幅が効かない <table></table>に上記CSSを一括で当てると、予期せぬレイアウト崩れが起きる。 スクロールが必要ないテーブルの場合、セルは中身の幅にフィットした横幅までしか広がらないので、右側に空白が生まれてしまう・・・ 解決策その1:tableをdivで囲む スクロールが必要なテーブルだけに、CSSが当たるようにする。 .scroll-table table { display: block; overflow-x:

    はみ出たtableを横スクロールで滑らかに表示するCSS - Qiita
  • 1