Hello.


I tried to fix the header referring to the following

The header and the data part shifted, and it was not possible to implement it well.

<Referenced site>

https://success.outsystems.com/Documentation/Development_FAQs/How_to_scroll_records_in_a_table_with_a_fixed_header


<Screen capture>


If you know how to fix the header other than the method above, please let me know.

? The components of Forge can not be used because they were only supported by Outsystems.


Thank you.

Rio Toyoda wrote:

Hello.


I tried to fix the header referring to the following

The header and the data part shifted, and it was not possible to implement it well.

<Referenced site>

https://success.outsystems.com/Documentation/Development_FAQs/How_to_scroll_records_in_a_table_with_a_fixed_header


<Screen capture>


If you know how to fix the header other than the method above, please let me know.

? The components of Forge can not be used because they were only supported by Outsystems.


Thank you.

Hi Rio,


If you want to other method you can use jquery plugins for this-

https://www.jqueryscript.net/tags.php?/fixed%20table%20header/


Hi. I think I may have been able to identify your problem. 


When the scrollbar appears, the width of the table body allocates 16px to display the scrollbar, miss aligning the header and the scroll.


Option 1:

You could use width: calc(100%-16px) if always displaying the scrollbar is an option because when the table is not height enough, you will get the opposite scenario

In this case, you'll have to change overflow:auto to overflow:scrollbar

Option 2:

https://stackoverflow.com/a/51920644

With some tweaks in the css to fit OutSystems themes, this solution works and you don't have to concerned about cell's width as this can be apply to a default table record with header