Styling the text entry box | XM Community
Skip to main content

Hi! I would like to change the appearance for the box in text entry questions. Mainly the Text Entry questions, but also the text entry option in Multiple Choice questions. Most off all, I need to round the corners and make the border of the box less thick in the Classic Layout.

Does anyone know how to taget these boxes in CSS?

 

Hello @JohannesCE!

I managed to build this one time I had that exact need: 

I don’t really know much about CSS, but this has worked for me. 

.Skin inputntype=text] {
    border: 2px solid #525252;
     border-radius: 6px;

}

There you can define the border thickness (the standard is 2px, so if you want a less tick border, you should use 1). 

Also the color of the border (in hex code) 

And the border radius (just change that 6 for the radius you want)

Hope this helps!

Thanks @Ricmarug, that helped! I made some changes, because I want to target both Text/Graphic Questions as the text-entry option in Multiple Choice Questions:

/* Style the text-entry box */
.Skin .InputText,
.Skin .TextEntryBox {
    border: 1px solid #30B3AF !important;
    border-radius: 10px !important;
}

 

That’s great! Happy to help :) 

Leave a Reply


Terms & Conditions