JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.
Adding a help tip with Line checkbox widgetAsked by Jean-Claude Massé on August 04, 2016 at 10:30 AM
I'm trying to add a help tip using hover to the Line checkbox widget.
I try to put a kind of ? right after the field using a div inside the settings. But I cannot get Overflow to show it.
In the current form, you will see it cut in two (one part is in the checkbox, the other part is cut by the previous parent element).
Page 3: Ubegrenset print i stripsformat
Any tip on how to get this work?
checkbox checkbox widget adding
I believe the issue is that the help tip (question mark) inside the widget is not fully showing.
Please insert this CSS code inside the wizard widget (wand icon), it is in the Custom CSS tab:
right: 10px !important;
Here's the result after adding custom CSS code:
Hope that helps. Let us know if you need further assistance. Thank you.
No. My issue is that I want to move it more further to the right. This, I can do it. But, it not show because setting the field with overflow: visible doesn't work. (this I why I move it half in and half out. Just to show you that I cannot get overflow working). Or Maybe I can keep it at this place, but I cannot get my P tag to be showed. This P tags is related to information.
Heres my current settings.
In the field settings I set this:
Ubegrenset print i stripsformat<div class="help-tip"><p>This is the inline help tip! You can explain to your users what this section of your web app is about.</p></div>
My P is hidden, but got a help-tip div hover. So it's should show it. But It doesn't because the tip cannot overflow the parent.
What Is important, is just to be able to have a tool tip like this:
That is because of the width of the widget and since you have the tooltip inside the widget. You may consider doing it this way:
1. Use our text field to add the tooltip:
2. Shrink the fields to align them side by side:
3. Inject your tooltip CSS in the Custom CSS area of the form:
You need to adjust the margins.
I've cloned your form and made these changes, check it here: https://form.jotform.com/62166472780965.
Thanks. I need to work around this, but it's ok.