Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Add CSS class to question

pvdemael
Topic Author
Offline
Junior Member

More

11 years 3 months ago #121486 by pvdemael

Add CSS class to question was created by pvdemael

Hi,

I would like to change the CSS of some questions uniformely without the hassle of copy-pasting a lot.
Is it possible to add a CSS class to eg a question in Limesurvey?
The other options is to adjust CSS in template.css but maybe someone has.

The topic has been locked.

gabrieljenik
Offline
Official LimeSurvey Partner

More

11 years 3 months ago #121492 by gabrieljenik

Replied by gabrieljenik on topic Add CSS class to question

Have you seen www.limesurvey.org/manual/The_template_e...g_questions_with_CSS ?
You mean to modify current CSS?

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Checkout our Reporting Solutions and our plugin shop at www.encuesta.biz .

The topic has been locked.

pvdemael
Topic Author
Offline
Junior Member

More

11 years 3 months ago #121494 by pvdemael

Replied by pvdemael on topic Add CSS class to question

Well, I have several multiple numerical inputs with sliders. A few of them are used as a VAS scale and only those I would like to change some CSS. The others should remain untouched.
The only thing I can think of right now is add some CSS for every question in template.js.
A general solution like eg an extra input field in the question creation form for a custom css class should make things more easy.

The topic has been locked.

gabrieljenik
Offline
Official LimeSurvey Partner

More

11 years 3 months ago #121495 by gabrieljenik

Replied by gabrieljenik on topic Add CSS class to question

All questions have general questions CSS classes, but also have some specific, question id class.
So if you customize the class for a specific questionid, ony that question style will be modified.
Also, you can use id's.

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Checkout our Reporting Solutions and our plugin shop at www.encuesta.biz .

The following user(s) said Thank You: pvdemael

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

11 years 3 months ago - 11 years 3 months ago #121522 by tpartner

Replied by tpartner on topic Add CSS class to question

2 options...

1) As Gabriel suggests, use the question IDs as selectors in template.css:

Code:

#question12345 .ui-slider,
#question12346 .ui-slider,
#question12347 .ui-slider {
	/* Some style rules */
}

2) Use JavaScript in the source of those questions to assign a specific class:

Code:

<script type="text/javascript" charset="utf-8">	
	$(document).ready(function(){ 
		$('#question{QID}').addClass('vas-slider-question');
	});
</script>

Then in template.css:

Code:

.vas-slider-question .ui-slider {
	/* Some style rules */
}

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Last edit: 11 years 3 months ago by tpartner.

The following user(s) said Thank You: pvdemael

The topic has been locked.

pvdemael
Topic Author
Offline
Junior Member

More

11 years 3 months ago #121523 by pvdemael

Replied by pvdemael on topic Add CSS class to question

Hi tpartner,

I already did some work with the first option, but the second one option is more elegant.
I prefer a template.css file to be generic.
Thx

The topic has been locked.