search

primefaces / primeng

The Most Complete Angular UI Component Library
https://primeng.org
Other
10.3k stars 4.56k forks source link

Table: Not responsive within Sidebar Layout from PrimeBlocks #15735

Open kaposoniro opened 4 months ago

kaposoniro commented 4 months ago

Describe the bug

The responsive feature of tables seems to be broken when they are located within the main content of the Sidebar Layout taken from PrimeBlocks. It only seems to be the case when placed within a flex container.

Environment

Chrome, StackBlitz

Reproducer

https://stackblitz.com/edit/yub5cx-uqtdin

Angular version

17.3.7

PrimeNG version

17.17.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

20.12.2

Browser(s)

No response

Steps to reproduce the behavior

  1. Open StackBlitz
  2. Open Preview in new tab
  3. Shrink the browser until the table extends beyond the page size

brave_aWq0BHdvOd

Expected behavior

The table should not extend beyond the page size and display the horizontal scroll bar instead.

kaposoniro commented 4 months ago

Expected behavior should be like this:

brave_t548kmay8M

Joebeurg commented 4 months ago

Having the same issue, even after updating to 17.18 version which supports Angular V18 peer dependencies. The other option to avoid having a scrollbar on the BODY element, is using responsiveLayout="stack" which changes the table layout on smaller screens.