Datagrid: Use position sticky for frozen header

[tmcconechy]

Is your feature request related to a problem? Please describe.

Working on weekview position: sticky worked out well. See if i can use this on datagrid as well. This will help with accessibility and prevent mismatched columns.

Describe the solution you'd like

• Remove the use of two tables for sticky header
• Make sure we dont need to break table layouts
• Test all column width settings

Describe alternatives you've considered
Keep current solution

Additional context
https://codepen.io/chriscoyier/pen/PrJdxb
http://localhost:4000/components/week-view/example-index.html (currently on a branch)

[tmcconechy]

Relates to #1818 and #425

[brianjuan]

These pages passed QA on all browsers:

• http://4240-beta0-enterprise.demo.design.infor.com/components/datagrid/example-fixed-header.html
• http://4240-beta0-enterprise.demo.design.infor.com/components/datagrid/test-horizontal-scroll.html

But upon testing datagrid pages with test columns, I found a weird behavior on the pages below.

• http://4240-beta0-enterprise.demo.design.infor.com/components/datagrid/test-column-resize-issue.html
• http://4240-beta0-enterprise.demo.design.infor.com/components/datagrid/test-columns-mixed.html
• http://4240-beta0-enterprise.demo.design.infor.com/components/datagrid/test-columns-percent.html

When you try to resize a column, the columns will be auto resized.
On the video below, I'm trying to resize the first column.

[tmcconechy]

I looked at this as well as it was mentioned on the PR but could not figure out why. This would be nice to fix but is not required as its a problem only on some layouts.

Since this is already raised as a second issue lets just deal with it there #3251

Unfailing the issue

[brianjuan]

Noted on this @tmcconechy , will track the issues found on #3251 . Thank you.