I developed an Angular application using Angular Material that features a table with 22 columns. However, when I expand the browser window, some columns are hidden. Additionally, on mobile browsers, not all columns are displayed. I have attempted the following solutions:
- Initially, I utilized the Angular Material 'sticky' attribute. It worked well for browser widths up to 110%, but did not function properly when enlarging the browser size.
- I then incorporated Bootstrap and utilized
<table>
, but encountered issues on both mobile and large screens.
.html::
<!-- Your HTML code here -->
.css::
<!-- Your CSS code here -->
I am seeking a more responsive solution that will work seamlessly in any browser regardless of its size.