- Posts: 102
- Thank you received: 2
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
Floating Header
- boshra.m
- Topic Author
- Offline
- Premium Member
Less
More
1 year 11 months ago #227879
by boshra.m
Floating Header was created by boshra.m
Please help us help you and fill where relevant:
Your LimeSurvey version: [see right hand bottom of your LimeSurvey admin screen]
Own server or LimeSurvey hosting:
Survey theme/template:
==================
Hi,
I have entered this to insert a floating header: <style type="text/css" data-author="Tony Partner">
@media only screen and (min-width: 768px) {
#question{QID} .answer-container {
position: relative;
max-height: 500px;
overflow: scroll;
}
#question{QID} table.subquestion-list {
text-align: left;
position: relative;
border-collapse: collapse;
}
#question{QID} table.subquestion-list thead th,
#question{QID} table.subquestion-list thead td {
position: sticky;
top: 1px;
z-index: 1000;
background: #DDDDDD;
border: 0 none;
box-shadow: -1px 0 #000000, 0 1px #000000, 1px 0 #000000, 0 -1px #000000;
}
#question{QID} table.subquestion-list .ls-heading-repeat {
display: none;
}
}
</style>
However because there are two headers, they seem to overlap when I scroll. Is there any way to keep it "fixed"?
Also, is there a way to show the gridlines that are present in the rest of the question?
Thank you.
Your LimeSurvey version: [see right hand bottom of your LimeSurvey admin screen]
Own server or LimeSurvey hosting:
Survey theme/template:
==================
Hi,
I have entered this to insert a floating header: <style type="text/css" data-author="Tony Partner">
@media only screen and (min-width: 768px) {
#question{QID} .answer-container {
position: relative;
max-height: 500px;
overflow: scroll;
}
#question{QID} table.subquestion-list {
text-align: left;
position: relative;
border-collapse: collapse;
}
#question{QID} table.subquestion-list thead th,
#question{QID} table.subquestion-list thead td {
position: sticky;
top: 1px;
z-index: 1000;
background: #DDDDDD;
border: 0 none;
box-shadow: -1px 0 #000000, 0 1px #000000, 1px 0 #000000, 0 -1px #000000;
}
#question{QID} table.subquestion-list .ls-heading-repeat {
display: none;
}
}
</style>
However because there are two headers, they seem to overlap when I scroll. Is there any way to keep it "fixed"?
Also, is there a way to show the gridlines that are present in the rest of the question?
Thank you.
Please Log in to join the conversation.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10108
- Thank you received: 3593
1 year 11 months ago #227895
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Floating Header
We cannot help with such limited information.
You didn't answer the questions at the top of the first post so we have no clue about your LimeSurvey environment and you didn't attach a sample survey so we can't see the code used to insert the extra headers.
You didn't answer the questions at the top of the first post so we have no clue about your LimeSurvey environment and you didn't attach a sample survey so we can't see the code used to insert the extra headers.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Please Log in to join the conversation.
- boshra.m
- Topic Author
- Offline
- Premium Member
Less
More
- Posts: 102
- Thank you received: 2
1 year 11 months ago #228113
by boshra.m
Replied by boshra.m on topic Floating Header
Hi,
Sorry for the delayed response.
LimeSurvey Cloud Version 5.3.13
LimeSurvey Hosting
Fruity
Please find a .iss attachment below.
Please refer to the English version of the survey.
Thank you.
Sorry for the delayed response.
LimeSurvey Cloud Version 5.3.13
LimeSurvey Hosting
Fruity
Please find a .iss attachment below.
Please refer to the English version of the survey.
Thank you.
Please Log in to join the conversation.
- holch
- Away
- LimeSurvey Community Team
Less
More
- Posts: 11658
- Thank you received: 2742
1 year 11 months ago #228114
by holch
I hope you did NOT attache the International Space Station to this thread. I am a little afraid to open that file now...
It's hopefully a .LSS file, not an .ISS file.
I answer at the LimeSurvey forum in my spare time, I'm not a LimeSurvey GmbH employee.
No support via private message.
Replied by holch on topic Floating Header
Please find a .iss attachment below.
I hope you did NOT attache the International Space Station to this thread. I am a little afraid to open that file now...
It's hopefully a .LSS file, not an .ISS file.
I answer at the LimeSurvey forum in my spare time, I'm not a LimeSurvey GmbH employee.
No support via private message.
Please Log in to join the conversation.
- boshra.m
- Topic Author
- Offline
- Premium Member
Less
More
- Posts: 102
- Thank you received: 2
1 year 11 months ago #228208
by boshra.m
Replied by boshra.m on topic Floating Header
Haha, oops!
Please Log in to join the conversation.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10108
- Thank you received: 3593
1 year 11 months ago #228284
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Floating Header
Try this:
Sample survey attached:
Code:
<style data-author="Tony Partner" type="text/css"> @media only screen and (min-width: 768px) { #question{QID} .answer-container { position: relative; max-height: 300px; overflow: scroll; } #question{QID} table.subquestion-list { text-align: left; position: relative; border-collapse: collapse; } #question{QID} table.subquestion-list thead { position: sticky; top: 1px; z-index: 1000; } #question{QID} table.subquestion-list thead th, #question{QID} table.subquestion-list thead td { background: #DDDDDD; border: 0 none; box-shadow: -1px 0 #000000, 0 1px #000000, 1px 0 #000000, 0 -1px #000000; } #question{QID} table.subquestion-list .ls-heading-repeat { display: none; } } </style>
Sample survey attached:
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The following user(s) said Thank You: boshra.m
Please Log in to join the conversation.