Adding a help tip with Line checkbox widget

  • Profile Image
    Jean-Claude Massé 
    Asked 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?


  • Profile Image
    Answered on August 04, 2016 at 01:12 PM

    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:

    .help-tip { 
    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.

  • Profile Image
    Answered on August 04, 2016 at 02:00 PM

    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. 

  • Profile Image
    Answered on August 04, 2016 at 03:02 PM

    What Is important, is just to be able to have a tool tip like this:

  • Profile Image
    Answered on August 04, 2016 at 04:17 PM

    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:

  • Profile Image
    Answered on August 10, 2016 at 05:06 PM

    Thanks. I need to work around this, but it's ok.