Float matrix column headings

Hi,

Is it possible to make the heading of a matrix 'float' so they are always visible to the user? I have a long matrix and want to be able to fix the headings so they are always visible.

I have tried to use position: fixed; but this seems to group all three headings together.

Many thanks in advance.

Hi,

Thank you for contacting us.

I cloned your form with ID: 63532463376964 into my account and tested on my side.

By matrix heading, do you mean the Question Text of the Matrix or yes, no, n/a columns?

You can alter, edit the Question Test as shown in the following.

1. Click on Edit Properties of the Matrix Field.

2. Type the instruction to the Question Text field.

If this is not the case, you are referring to yes, no, n/a columns, could you clearly describe your problem with screenshots? 

I can see the labels on the top of the matrix in both the URL you have provided and in the test submission I have sent to the form I cloned. Could you clarify the issue?

Waiting for your response.

Thank you.

Hi,

My aim was to get the column heading Yes, No and N/A to stay in a fixed location so that when you scroll down the page the user can see which columns they refer to. 

I tried position: fixed; but all three column heading seem to group together under one column but this is what I want to achieve. The column heading is always visible when you scroll down the page.

Screenshot below

Hi,

Thank you for your reply.

Unfortunately, we do not offer that feature. In Matrix fields, the columns and rows are fixed. 

If you have further questions, please let us know.

Hi again,

I apologize for the misinformation. I consulted one of our developers and came up with a solution to your problem. To fix your issue kindly inject the custom CSS codes below to your form.

table.form-matrix-table tbody .form-matrix-values {

    width: 40px !important;

}

th.form-matrix-column-headers.form-matrix-column_2{

    margin-left: 98px;

}

th.form-matrix-column-headers.form-matrix-column_1{

    margin-left: 49px;

}

Here is the user guide on injecting custom CSS codes.

https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

This should fix your issue. However, since you cannot put any restrictions to the matrix column headers, they can be shown outside of the matrix field.

Thank you for your understanding.