Simulating sub-label line breaks with CSS - RESOLVED

  • Profile Image
    AA_C
    Asked on January 18, 2017 at 01:50 PM

    I have a long line of text for a sub-label. I would like to break into two lines similar to what I show below

     From

    On a Nom qui apparaît sur le certificat. Maximum 20 caractèresform 

     To

    On a Nom qui apparaît sur le certificat.
    Maximum 20 caractèresform 
         

    I can't insert a <br /> to do this, so what injected css code will accomplish it?  

    Thank you,

     

    Regards
    Robert
    AAC

  • Profile Image
    Mike
    Answered on January 18, 2017 at 03:05 PM

    There is no direct way to add line breaks with CSS, but it might be possible to use :after and :before pseudo-elements to get 2 or 3 separate lines of the text.

    For example, add the 'On a Nom qui apparaît sur le certificat.' text as sub label and 'Maximum 20 caractèresform' text as :after content.

    #cid_9 .form-sub-label:after {
    display:flex;
    content: "Maximum 20 caractèresform";

    }

    Thank you.

  • Profile Image
    AA_C
    Answered on January 19, 2017 at 03:24 PM

    Hi,

    This did exactly what I wanted. Thank you!

    Regards
    Robert
    AAC

  • Profile Image
    Mike_G
    Answered on January 19, 2017 at 07:54 PM

    On behalf of my colleague, Mike, you're most welcome.

    Please feel free to contact us again anytime should you have other questions or concerns.

    Thank you.