How do I move hover text so it doesn't cover the field?

Please see my screenshot which shows how the hover text actually covers the radio buttons that need to be selected. Our customers are struggling to select them because the text pops up over the field. How do I move this text please?

Adding the following CSS to your form should fix the hover text position in your form:

https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

.form-description {

right: 0px !important;

left: 230px !important;

width: 180px !important;

max-width: 180px !important;

}

Here is how the form would look with the changes made:

https://form.jotform.com/63494981763976

I have followed the instructions and added this to the end of the CSS and it doesn't appear to have changed anything. Can you please advise if I'm supposed to add it somewhere else? I've never used CSS before.

Hmm, that was weird, although you said you never used CSS before, when I checked your form it was heavily customized with CSS.

The reason it didn't work was because the codes given by my colleague were accidentally pasted incorrectly.

To better explain it, here's a short clip showing how to fix it:

To sum it up, you need to ensure you have pairs of opening and closing curly braces to avoid syntax errors.

e.g.

element {

   css codes here

}

We imported our forms originally from Adobe, so maybe that created the CSS? We don't use it here so it is whatever was in the background of the form originally.

Thanks for the video - I added the parentheses and it works now.

Ah I see, that's probably the reason why. Well, I'm glad you're all set now :)

Happy Holidays!