Skip to content
GitLab
Projects Groups Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Register
  • Sign in
  • Framadate Framadate
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 259
    • Issues 259
    • List
    • Boards
    • Service Desk
    • Milestones
  • Merge requests 53
    • Merge requests 53
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Commits
  • Issue Boards
Collapse sidebar
  • FramasoftFramasoft
  • FramadateFramadate
  • FramadateFramadate
  • Merge requests
  • !492

fix: prevent horizontal page overflow on mobile devices

  • Review changes

  • Download
  • Email patches
  • Plain diff
Open Jonas requested to merge jonaskuske/framadate:bug/prevent-table-overflow-in-chrome into develop Jul 13, 2021
  • Overview 0
  • Commits 1
  • Pipelines 1
  • Changes 1

The scrollable table inside .tableContainer causes the entire page to overflow (horizontally) in Chromium/Blink browsers when viewed on a small device like a phone.

Here's a screenshot: image

This is especially annoying because every time you tap an item within the table, the browser will jump to the right and you have to scroll back manually, when you select the next item it happens again, and so on...

Not 100% sure what's causing this (seems to be an inconsistency in different browsers' table layout algorithms?) but adding contain: layout to the .tableContainer fixes the page-wide overflow, while still keeping the table scrollable.

Assignee
Assign to
Reviewers
Request review from
Time tracking
Source branch: bug/prevent-table-overflow-in-chrome