Possible to style a specific answer column?

More
4 years 3 months ago #94620 by smiit
smiit created the topic: Possible to style a specific answer column?
I have an array question with 6 answer columns.

Is it possible to use CSS styling to modify only the 1st column?

I want to draw a border around it and add shading but leave the remaining 5 columns to the right of it unaffected.

Thanks.

Please Log in to join the conversation.

More
4 years 3 months ago - 4 years 3 months ago #94637 by tpartner
tpartner replied the topic: Possible to style a specific answer column?
Add this to the end of template.js:
$(document).ready(function() { 	
	// Add some column-specific classes
	$('.array-flexible-row table.question tr').each(function(i, el){
		$('> *', this).each(function(i, el){ 
			$(el).addClass('col-'+i);
		});
	});
});


And then something like this to the end of template.css:
.array-flexible-row .col-1 {
	background: pink !important;
	border: 1px solid red;
}



Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
Last Edit: 4 years 3 months ago by tpartner. Reason: Typo
The following user(s) said Thank You: smiit

Please Log in to join the conversation.

More
4 years 3 months ago #94655 by DenisChenu
DenisChenu replied the topic: Possible to style a specific answer column?
And only css solution:
.array-flexible-row table.question tbody td:first-of-type  {
	background: pink !important;
	border: 1px solid red;
}
www.w3.org/CSS/Selectors/pseudo-classes/:first-of-type

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in to join the conversation.

More
4 years 3 months ago #94658 by tpartner
tpartner replied the topic: Possible to style a specific answer column?

And only css solution:

Yes, but be aware that it's not supported in IE7 or IE8 - reference.sitepoint.com/css/pseudoclass-firstoftype

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.

More
4 years 3 months ago #94756 by smiit
smiit replied the topic: Possible to style a specific answer column?
Thank you both for the clear, timely responses. Tony's .js plus css combo worked perfectly.

Please Log in to join the conversation.

More
4 years 3 months ago #94781 by DenisChenu
DenisChenu replied the topic: Possible to style a specific answer column?

tpartner wrote:

And only css solution:

Yes, but be aware that it's not supported in IE7 or IE8 -

Maybe selectivizr.com/ can be added ;).

And for give the "Can i use" , i prefer caniuse.com/ : caniuse.com/#feat=css-sel3
Because in CC-by-sa 3 ;)

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in to join the conversation.

Did you already participate in our customer survey?

Don't miss your chance for great prices.

Please click here to participate:

Start now

Start now!

Just create your account and start using Limesurvey today.

Register now