Controlling hover text position using custom CSS

  • Profile Image
    DanBlum
    Asked on November 20, 2015 at 09:05 PM

    I want to move the hover text on the option tools that are in my form.  I found instructions for doing so.  I found the CSS code that I should enter and found the spot to enter the CSS code under preferences->form styles.  I entered the suggested code, but the hover text did not move.  The hover text  still conceals the scroll bars.   What am I doing wrong?

     

    Here's the code I inserted :

    form-description {

        position : absolute;

        right : -150px;

    }

    I adjusted the number pixels to be even larger but to no avail.  I wonder if the code :  "form-description" should be something that is related to hover text????

     

    See my form.

     

     

     

     

  • Profile Image
    Jan
    Answered on November 21, 2015 at 10:26 AM

    The class form-description is the correct selector. Please don't forget the "." or period before the selector.

    There is an existing style for that selector. In order to change that, you need to override the value. You can do that by adding !important in the value.

    .form-description {

    right: -150px !important;

    }

    You can now fully customize the position of the hover text.

    Hope that helps. Let us know if you need any more help. Thank you.

  • Profile Image
    DanBlum
    Answered on November 21, 2015 at 11:23 AM

    Thanks.  That worked.  I am totally ignorant of the CSS language (its name, syntax, and semantics...what else is there...like I said "totally"), so I was at the mercy of the post I read for positioning hover text.  That made me not catch that I had missed  the period (a syntactic requirement) when I copied and pasted the command, nor was I aware of the "important" value (semantics).   So your help was priceless.

    From my experience with other languages, I did sense that the 150 is the number of pixels and "right" is the direction to move it.  I still don't see what in the command connects this solely to hover text.  But, you don't need to go into that...my intent is not for you to teach me CSS.  

    By the way, I am a retired programmer, and back in the 1980's I used a CSS language, but that was Computer Simulation Language which I used to write a stochastic model of the to-be-announced IBM S/38 to predict it's performance and evaluate alternative designs. 

    You guys are great.  I always get quick and easy to understand answers. 

     

     

    Thanks.

     

  • Profile Image
    jonathan
    Answered on November 21, 2015 at 09:24 PM

    Thank you for the confirmation that all is good now on your form. We appreciate also your effort on  taking the time providing us more details.

    I would also recommend reviewing our Form Designer video guides which you can find here http://www.jotform.com/help/300-Form-Designer-Tutorial-Let-s-create-fantastic-forms-

    You can watch and learn basics on CSS on the video http://www.jotform.com/form-designer/tuts/episode4/

    Feel free to contact us again anytime should you need assistance on JotForm

    Cheers