Auto resize labels in answer choices

More
1 year 7 months ago #198380 by eceakca
Hello everyone,
My question probably has a very simple solution but I cannot find it anywhere. I ask a question as array type. In answer options I have labels. since my label is a little bit long, when I show it on the screen it divides the text. For example, the label is "Don't agree". And when I change the screen size during the survey, it looks like
"Don't agr
ee".
So is it possible to auto readjust the font of the text into the field, or maybe auto resize the width or hight of the column size. I added a screen view as well. It might be clear to show.
Attachments:
The topic has been locked.
More
1 year 7 months ago #198394 by holch
No, I don't think this is possible.

But one hint for your scale looking better:

As all numbers despite the 1 and the 7 are aligned at the bottom, I would use something like:
Don't agree</br>1

Instead of:
1 - Don't agree

Because it will show all numbers aligned at the bottom and the texts above. Just looks nicer.

I answer at the LimeSurvey forum in my spare time, I'm not a LimeSurvey GmbH employee.
No support via private message.
The topic has been locked.
More
1 year 7 months ago #198406 by Joffm
Hi,
with this javascript
<script type="text/javascript" charset="utf-8">
 
	$(document).on('ready pjax:scriptcomplete',function(){
 
		// Identify this question
		var thisQuestion = $('#question{QID}');
 
		// Add a question class
		thisQuestion.addClass('custom-array');
 
		// Column-specific classes
		$('table.subquestion-list tr', thisQuestion).each(function(i) {
			$('th, td', this).each(function(i) {
				$(this).addClass('column-'+i);
			});
		});
 	});
</script>
and this css
<style type="text/css">.custom-array table.subquestion-list col {
		width: auto !important;
	}
 
 	.custom-array table.subquestion-list thead .column-1 {width: 15%; }
	.custom-array table.subquestion-list thead .column-2 {width: 6%; }
	.custom-array table.subquestion-list thead .column-3 {width: 6%; }
	.custom-array table.subquestion-list thead .column-4 {width: 6%; }
	.custom-array table.subquestion-list thead .column-5 {width: 6%; }
	.custom-array table.subquestion-list thead .column-6 {width: 6%; }
	.custom-array table.subquestion-list thead .column-7 {width: 15%; }
</style>

you can adjust the size of each column



And - as holch - insert linefeeds <br>

Joffm


Volunteers are not paid.
Not because they are worthless, but because they are priceless
Attachments:
The following user(s) said Thank You: tpartner
The topic has been locked.
More
1 year 7 months ago #198433 by eceakca
you are amazing Joffm :) It seems really nice. But your answer gives me 2 questions :)
First should I add 2 parts, both javascript and CSS?
Secondly I have no idea where can I write these scripts? or how can I reach these script informations? The whole day I was just googleing "How can I change CSS file in Lime Survey?" And I still don't know how to open these scripts. As you can see I am a total newby.
The topic has been locked.
More
1 year 7 months ago - 1 year 7 months ago #198438 by Joffm
Hi,
in this case, Google is never your friend.

What do you do?

That's all.

First should I add 2 parts, both javascript and CSS?

If not, it was useless to show them. ;)

And I still don't know how to open these scripts

You copy these two snippets and paste them into your question text (in source code mode).
The same as you'd copy any other text.
Or what do you mean by "open these scripts"?


And of course you may adapt the values in the css to your desire.

Joffm


Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 1 year 7 months ago by Joffm.
The topic has been locked.
More
1 year 7 months ago #198446 by eceakca
I did exactly what you said :) I copied two scripts into source code part. It shows perfectly :)
At first I tought I have to change CSS documents, that is why I was worried. Now,as long as it works i am okay :) Thank you very much for your help.
The topic has been locked.
More
1 year 6 months ago #199000 by GuernseyResearch
reduce the width of the question area
for version 3 - edit - display -(sub-)question width

If you make that smaller, but still fit your question, it will give you more room for the answer titles
The topic has been locked.

Start now!

Just create your account and start using Limesurvey today.

Register now