Change hover text font size without changing the font size of main text in multiple choice option

Try using a CSS tooltip instead of Title: https://www.w3schools.com/css/css_tooltip.asp I modified the above example slightly as a starting point for you. Example code: <style> /* Tooltip container */ .tooltip { position: relative; display: inline-block; } /* Tooltip text */ .tooltip .tooltiptext { visibility: hidden; background-color: black; color: #fff; text-align: center; padding: 5px 0; border-radius: 6px; top: -5px; left: 105%; font-size: 40px; /* this changes your hover text font size */ } /* Show the tooltip text when you mouse over the tooltip container */ .tooltip:hover .tooltiptext { visibility: visible; } </style> <div class="tooltip">TEXT TO DISPLAY AS MAIN TEXT <span class="tooltiptext">TEXT TO HOVER</span> </div>

Thanks Matt! Not sure if this is what I was supposed to do but I pasted your code in rich text format/source but nothing happens when I mouseover (no hover text appears). Additionally, I've attached an screenshot where you can see that the question text is not aligned properly next to the button. ! Any suggestions? Thanks so much.

Well, it looks like something has gone wrong there. I'm attaching a QSF file of a working example. Can you import this and try it out? How does it look when you preview the survey?

It looks great and the hover works! I wonder if there is an issue pasting the code into the multiple choice option which is what I'm trying to do. In the survey example you sent, the code is entered in the Question Text section.

Oh, I misunderstood you initially. Thought you wanted the hover to happen on the question text itself. Doing it on the single answer choice will require some additional thought, because that's probably going to depend on which survey theme you have applied. Can you speak more about why you want this mouseover behavior only to be applied to one specific answer choice? Maybe it will lead to a better solution for you.

Thanks, sure... We actually want the hover to be applied to 4 out of 5 single choice options in our survey. The 4 single choices are ratings,(Outstanding, Successful, Partially Successful, etc.). Each rating has its own definition. It is the definition of each rating that we want to appear on hover/mouseover. Does that help?

The simple solution here is to add the style tag to your question html view, and use the div setup from it in your answers, this *should* work. Though is untested by me at the moment.

@Matt_Christie_Walker, @AnthonyR - Thank you both! I haven't had an opportunity to try this but will keep you posted. Thanks again for your support!

@Matt_Christie_Walker @AnthonyR - Just a shout-out! I am all set and have applied the code you sent to the multiple choice options in the question. The only thing I changed was the background color of the hover and font size and color for the text. Thank you both!

@matt_christie_walker - I imported your qsf file. the mouseover does not seem to work in preview mode. does that make sense?

Hi everyone - I have implemented the above suggestion in HTML view of the answers. It's working perfectly! One question - is there a way to expand the hover area? The only way the message pops up is if the user hovers exactly on the answer. Ideally, the message would show when the user hovers anywhere over the answer. !