Centering question text

[Benedek Kurdi]

Hi all,

This might be totally trivial, but I haven't been able to find an answer on the documentation page.

Is it possible to (easily) change the formatting of a question like the one below, e.g., have the text be centered instead of left aligned?

I'm attaching the relevant explicit file in case that makes things easier.

Thanks so much!

—Benedek

[Yoav Bar-Anan]

Hi Benedek, 

I am not sure, so I played a bit with this questionnaire, and here is what I found out:

- If you want some control of the stem's text, then you need to put it in a <p> element, like so:

    stem : '<p style="text-align:center;">How much do you like or dislike this person?</p>' + 
     '<br/><image src="whatever.jpg"></image>',

- You can see in the previous example that I added an inline style property to <p> and set the alignment to the center. However, it would be the center of the image, not the center of the whole page. Like so:

- If you want it to be at the center of the whole page, I am not sure you can do that. The issue is that behind the scenes, the whole stem is displayed in a <label> tag, and the <label> tag's width is set according to the width of the elements in it (in this case, the <p> and the <image>). So, it will not be wider than the text or the image in it, and therefore centering the text would not center it within the whole page that you see. For example, I tried the following:

    stem : '<p style="text-align:center;width:800px">Do you like?</p>' + 
     '<br/><image src="<%=global.mediaURL%><%=questionsData.stim%>_1_s.jpg"></image>',

That sets the width of the stem to 800px, so it might look like this:

That's not recommended, because you can't guess what the width of the whole question (the whole page) is, so the stem has a smaller (or larger) width, and the text is not exactly at the center.

In summary, if you want the text to be at the center of the image, then the first example would work, but if you want it at the center of the whole page, I don't know how to do that. 

By the way, I sometimes find the style property margin-left useful for making sure that the text is not left-aligned too much:

    stem : '<p style="margin-left:19px">Do you like?</p>' + 
     '<br/><image src="<%=global.mediaURL%><%=questionsData.stim%>_1_s.jpg"></image>',

Yoav

--
You received this message because you are subscribed to the Google Groups "Minno.js" group.
To unsubscribe from this group and stop receiving emails from it, send an email to minnojs+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/minnojs/CAPGF78Gk0OrGO-uP4YH8-yqZFxzi5kntgq4vCDUqMek11GMj5g%40mail.gmail.com.

[Benedek Kurdi]

Got it, thank you!

--

Benedek Kurdi

768 State St

New Haven, CT 06511

(617) 528-8599