Qualtrics: Two Column Matrix Labels. Use the following CSS to change Matrix row labels into two columns. The optional JavaScript can be used to label the columns. #qualtrics #css #js #jq #matrix #label #column

add2ndLabelColumnToMatrix.css

<style type="text/css">
.wrap {
	width:300px;
	margin:0 auto;
	float:left;
}
.left_col {
	float:left;
	width:240px;
	text-align:left;
}
.right_col {
	float:right;
	width:60px;
	text-align:center;
}
</style>

add2ndLabelColumnToMatrix.html

<div class="wrap"><div class="left_col">Label1</div><div class="right_col">Label2</div></div>

addMatrixColHeadersTo2LabelMatrix.js

Qualtrics.SurveyEngine.addOnload(function() {
	var leftLabel = "Left";
	var rightLabel = "Right";
	//No changes below
	var r1c1 = jQuery("#"+this.questionId+" .c1:first");
	r1c1.removeAttr("width");
	r1c1.html("<div class='wrap'><div class='left_col'>"+leftLabel+"</div><div class='right_col'>"+rightLabel+"</div></div>");
});

Instructions:

1. Add the CSS under the question’s question text in HTML View.
2. Adjust the widths as needed
3. Format the matrix row labels (choices) as shown in the html above.
4. If using the js to add headers to the columns, change "Left" and "Right" as appropriate.

See additional Qualtrics solutions at: https://qualtricswiki.tgibbons.com/doku.php