Lining up wrapped response texts
When a categorical response text is too long to display on a single line, the interviewing program wraps it onto as many lines as necessary. This wrapping is very simple and does not take into account the radio button or check box at the start of the first line, so the continuation lines start underneath these buttons. You can force the interviewing program to line up continuation texts with the start of the text on the first line by editing the .css file for the project.
To line up continuation texts in response lists, add mrSingle, mrSingleText, mrMultiple, mrMultipleText, mrOtherEdit, and mrOtherText sections to your style sheet as follows:
Add the following style for span layout
/* ---- Lining Up Wrapped Response Texts Control ---- */
span.mrQuestionTable span input.mrMultiple, span.mrQuestionTable span input.mrSingle{position:absolute;}
span.mrQuestionTable span label span.mrMultipleText, span.mrQuestionTable span label span.mrSingleText{display:inline-block;margin-left:3em;}
/* ---- mrOther Style Control ---- */
span.mrQuestionTable span span input.mrOtherEdit {margin-left:3.5em;}
span.mrQuestionTable span span label span.mrOtherText {display:block;margin-left:3em;}
Add the following style for table layout
/* ---- For Table Layout ---- */
table.mrQuestionTable[style*='margin-left'] tbody tr td input.mrMultiple, table.mrQuestionTable[style*='margin-left'] tbody tr td input.mrSingle{position:absolute;}
table.mrQuestionTable[style*='margin-left'] tbody tr td label span.mrMultipleText, table.mrQuestionTable[style*='margin-left'] tbody tr td label span.mrSingleText{display:inline-block;margin-left:3em;}
/* ---- mrOther Style Control For Table Layout ---- */
table.mrQuestionTable[style*='margin-left'] tbody tr td input.mrOtherEdit {margin-left:3.5em;} table.mrQuestionTable[style*='margin-left'] tbody tr td span label span.mrOtherText {display:block;margin-left:3em;}
/* ---- Clear GridCategory Control Style For Table Layout ---- */
table.mrQuestionTable tbody tr td[class~=mrGridCategoryText] ~ td input.mrSingle{display:inline;position:static;}
table.mrQuestionTable tbody tr td[class~=mrGridCategoryText] ~ td input.mrMultiple{display:inline;position:static;}
Notes
▪You can include both Span Layout and Table Layout in the same style sheet.
▪When using Table Layout you must include the Clear GridCategory Control Style section. Failure to include the section will result in Grid control display issues.
▪The margin-left: 3em; attributes are required, but you can change their values.
▪If your project does not have a stylesheet, you can copy the default one (for example,
[INSTALL_FOLDER]\IBM\SPSS\DataCollection\7\Interviewer\ Server\Server\mrIWebCATI\CATIPlayer.css for telephone interviews) to your project’s source folder, and then change it. Then add an
<mrRef> tag to the project’s layout template naming the
.css file as described in
Naming the stylesheet in the template.
See also