Applying ::first-leter CSS rule onto an element in email template

  • JORGE_GARCIA
    Asked on December 10, 2015 at 6:02 AM

    Hi. I would insert this CSS style

    p::first-letter {
        color: #ffffff;
        font-size: 200%;
    }

    to the <td> framed in red in my Auto Responder 3. Is this possible? Thanks in advance.

    Applying ::first leter CSS rule onto an element in email template Image 1 Screenshot 20

    http://www.jotform.com//?formID=53381292778365

  • Ben
    Replied on December 10, 2015 at 8:44 AM

    Since this would be sent in an email, it is best to use the inline CSS codes, where such code would not work in most email clients and especially in webamil inboxes.

    My suggestion would be to change it up so that instead of:

    p::first-letter {
        color: #ffffff;
        font-size: 200%;
    }

    ....

    <p>(dedicatoria)</p>

    to make it as such:

    <p>(<span style="color:#ffffff; font-size:200%;">d</span>edicatoria)</p>

    In doing so, the element should be shown nicely in the email with the desired style applied to it.

    Do of course let us know how it goes.

  • JORGE_GARCIA
    Replied on December 10, 2015 at 8:59 AM

    Hi. I think I have not been understood.

    I want the first letter of my textarea form appears in a larger size.

    The CSS option is the one I mentioned above, but not how to include it in the style of the <td>.


    {dedicatoria} is the input field that corresponds to the textarea.

    See http://www.w3schools.com/cssref/sel_firstletter.asp

     

  • Mike
    Replied on December 10, 2015 at 10:44 AM

    It looks like that pseudo classes are not supported within inline styles, so unfortunately, we cannot select a first Textarea letter in email template.

  • JORGE_GARCIA
    Replied on December 10, 2015 at 10:51 AM

    OK. THANKS.