What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

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.


  • Profile Image

    E-mail embedded form - contains unwanted bullet points and right align.

    Asked by AllyatCoates on November 18, 2013 at 02:52 PM

    I am trying to imbed a form in an e-mail. I've gotten the e-mail to appear by following instructions here: http://www.jotform.com/answers/35502-Can-one-insert-a-jotform-into-an-email-message-e-g-gmail

     However, the e-mail has bullet points. Some other users had successfully solved it by using CSS, however I tried the injecting CSS method and a few manual tries, but no dice. My embedded e-mail still has bullet points and the field labels are right aligned. Any thoughts on how I could get this to work?

    Thanks!

     

    My raw code is below. Form URL is here: http://form.jotform.co/form/33214227842853

     

    <script src="//cdn.jotfor.ms/static/jotform.js?3.1.993" type="text/javascript"></script>

    <script type="text/javascript">

       JotForm.init(function(){

          $('input_4').hint('ex: myname@example.com');

          JotForm.description('input_4', 'Please insert your CFS e-mail address.');

       });

    </script>

    <link target="_blank" href="http://cdn.jotfor.ms/static/formCss.css?3.1.993" rel="nofollow" rel="stylesheet" type="text/css" />

    <link type="text/css" rel="stylesheet" target="_blank" href="http://cdn.jotfor.ms/css/styles/nova.css?3.1.993" rel="nofollow" />

    <link type="text/css" media="print" rel="stylesheet" target="_blank" href="http://cdn.jotfor.ms/css/printForm.css?3.1.993" rel="nofollow" />

    <style type="text/css">

        .form-label{

            width:150px !important;

        }

        .form-label-left{

            width:150px !important;

        }

        .form-line{

            padding-top:12px;

            padding-bottom:12px;

        }

        .form-label-right{

            width:150px !important;

        }

        .form-all{

            width:690px;

            color:#555 !important;

            font-family:'Lucida Grande';

            font-size:14px;

        }

        .form-radio-item label, .form-checkbox-item label, .form-grading-label, .form-header{

            color:#555;

        }


        /* Injected CSS Code */

    li {

        list-style-type:none;


        /* Injected CSS Code */

    </style>


    <form class="jotform-form" action="http://submit.jotform.co/submit/33214227842853/" method="post" name="form_33214227842853" id="33214227842853" accept-charset="utf-8">

      <input type="hidden" name="formID" value="33214227842853" />

      <div class="form-all">

        <ul class="form-section">

          <li id="cid_1" class="form-input-wide">

            <div class="form-header-group">

              <h2 id="header_1" class="form-header">

                Where would you like your new CFS Insurance card sent?

              </h2>

            </div>

          </li>

          <li class="form-line" id="id_3">

            <label class="form-label-left" id="label_3" for="input_3">

              Full Name<span class="form-required">*</span>

            </label>

            <div id="cid_3" class="form-input"><span class="form-sub-label-container"><input class="form-textbox validate[required]" type="text" size="10" name="q3_fullName3[first]" id="first_3" />

                <label class="form-sub-label" for="first_3" id="sublabel_first"> First Name </label></span><span class="form-sub-label-container"><input class="form-textbox validate[required]" type="text" size="15" name="q3_fullName3[last]" id="last_3" />

                <label class="form-sub-label" for="last_3" id="sublabel_last"> Last Name </label></span>

            </div>

          </li>

          <li class="form-line" id="id_4">

            <label class="form-label-left" id="label_4" for="input_4">

              Coates e-mail<span class="form-required">*</span>

            </label>

            <div id="cid_4" class="form-input">

              <input type="email" class=" form-textbox validate[required, Email]" id="input_4" name="q4_coatesEmail" size="30" value="" />

            </div>

          </li>

          <li class="form-line" id="id_5">

            <label class="form-label-left" id="label_5" for="input_5">

              Send to this address<span class="form-required">*</span>

            </label>

            <div id="cid_5" class="form-input">

              <table summary="" class="form-address-table" border="0" cellpadding="0" cellspacing="0">

                <tr>

                  <td colspan="2"><span class="form-sub-label-container"><input class="form-textbox validate[required] form-address-line" type="text" name="q5_sendTo[addr_line1]" id="input_5_addr_line1" />

                      <label class="form-sub-label" for="input_5_addr_line1" id="sublabel_5_addr_line1"> Street Address </label></span>

                  </td>

                </tr>

                <tr>

                  <td colspan="2"><span class="form-sub-label-container"><input class="form-textbox form-address-line" type="text" name="q5_sendTo[addr_line2]" id="input_5_addr_line2" size="46" />

                      <label class="form-sub-label" for="input_5_addr_line2" id="sublabel_5_addr_line2"> Street Address Line 2 </label></span>

                  </td>

                </tr>

                <tr>

                  <td width="50%"><span class="form-sub-label-container"><input class="form-textbox validate[required] form-address-city" type="text" name="q5_sendTo[city]" id="input_5_city" size="21" />

                      <label class="form-sub-label" for="input_5_city" id="sublabel_5_city"> City </label></span>

                  </td>

                  <td><span class="form-sub-label-container"><input class="form-textbox validate[required] form-address-state" type="text" name="q5_sendTo[state]" id="input_5_state" size="22" />

                      <label class="form-sub-label" for="input_5_state" id="sublabel_5_state"> State / Province </label></span>

                  </td>

                </tr>

                <tr>

                  <td width="50%" function zip(){var iterator=Prototype.K,args=$A(arguments);if(Object.isFunction(args.last())) iterator=args.pop();var collections=[this].concat(args).map($A);return this.map(function(value,index){return iterator(collections.pluck(index));});}><span class="form-sub-label-container"><input class="form-textbox validate[required] form-address-postal" type="text" name="q5_sendTo[postal]" id="input_5_postal" size="10" />

                      <label class="form-sub-label" for="input_5_postal" id="sublabel_5_postal"> Postal / Zip Code </label></span>

                  </td>

                  <td style="display: none;"><span class="form-sub-label-container"><select class="form-dropdown validate[required] form-address-country" name="q5_sendTo[country]" id="input_5_country">

                        <option value="" selected> Please Select </option>

                        <option value="United States"> United States </option>

                        <option value="Afghanistan"> Afghanistan </option>

                        <option value="Albania"> Albania </option>

                        <option value="Algeria"> Algeria </option>

                        <option value="American Samoa"> American Samoa </option>

                        <option value="Andorra"> Andorra </option>

                        <option value="Angola"> Angola </option>

                        <option value="Anguilla"> Anguilla </option>

                        <option value="Antigua and Barbuda"> Antigua and Barbuda </option>

                        <option value="Argentina"> Argentina </option>

                        <option value="Armenia"> Armenia </option>

                        <option value="Aruba"> Aruba </option>

                        <option value="Australia"> Australia </option>

                        <option value="Austria"> Austria </option>

                        <option value="Azerbaijan"> Azerbaijan </option>

                        <option value="The Bahamas"> The Bahamas </option>

                        <option value="Bahrain"> Bahrain </option>

                        <option value="Bangladesh"> Bangladesh </option>

                        <option value="Barbados"> Barbados </option>

                        <option value="Belarus"> Belarus </option>

                        <option value="Belgium"> Belgium </option>

                        <option value="Belize"> Belize </option>

                        <option value="Benin"> Benin </option>

                        <option value="Bermuda"> Bermuda </option>

                        <option value="Bhutan"> Bhutan </option>

                        <option value="Bolivia"> Bolivia </option>

                        <option value="Bosnia and Herzegovina"> Bosnia and Herzegovina </option>

                        <option value="Botswana"> Botswana </option>

                        <option value="Brazil"> Brazil </option>

                        <option value="Brunei"> Brunei </option>

                        <option value="Bulgaria"> Bulgaria </option>

                        <option value="Burkina Faso"> Burkina Faso </option>

                        <option value="Burundi"> Burundi </option>

                        <option value="Cambodia"> Cambodia </option>

                        <option value="Cameroon"> Cameroon </option>

                        <option value="Canada"> Canada </option>

                        <option value="Cape Verde"> Cape Verde </option>

                        <option value="Cayman Islands"> Cayman Islands </option>

                        <option value="Central African Republic"> Central African Republic </option>

                        <option value="Chad"> Chad </option>

                        <option value="Chile"> Chile </option>

                        <option value="People's Republic of China"> People's Republic of China </option>

                        <option value="Republic of China"> Republic of China </option>

                        <option value="Christmas Island"> Christmas Island </option>

                        <option value="Cocos (Keeling) Islands"> Cocos (Keeling) Islands </option>

                        <option value="Colombia"> Colombia </option>

                        <option value="Comoros"> Comoros </option>

                        <option value="Congo"> Congo </option>

                        <option value="Cook Islands"> Cook Islands </option>

                        <option value="Costa Rica"> Costa Rica </option>

                        <option value="Cote d'Ivoire"> Cote d'Ivoire </option>

                        <option value="Croatia"> Croatia </option>

                        <option value="Cuba"> Cuba </option>

                        <option value="Cyprus"> Cyprus </option>

                        <option value="Czech Republic"> Czech Republic </option>

                        <option value="Denmark"> Denmark </option>

                        <option value="Djibouti"> Djibouti </option>

                        <option value="Dominica"> Dominica </option>

                        <option value="Dominican Republic"> Dominican Republic </option>

                        <option value="Ecuador"> Ecuador </option>

                        <option value="Egypt"> Egypt </option>

                        <option value="El Salvador"> El Salvador </option>

                        <option value="Equatorial Guinea"> Equatorial Guinea </option>

                        <option value="Eritrea"> Eritrea </option>

                        <option value="Estonia"> Estonia </option>

                        <option value="Ethiopia"> Ethiopia </option>

                        <option value="Falkland Islands"> Falkland Islands </option>

                        <option value="Faroe Islands"> Faroe Islands </option>

                        <option value="Fiji"> Fiji </option>

                        <option value="Finland"> Finland </option>

                        <option value="France"> France </option>

                        <option value="French Polynesia"> French Polynesia </option>

                        <option value="Gabon"> Gabon </option>

                        <option value="The Gambia"> The Gambia </option>

                        <option value="Georgia"> Georgia </option>

                        <option value="Germany"> Germany </option>

                        <option value="Ghana"> Ghana </option>

                        <option value="Gibraltar"> Gibraltar </option>

                        <option value="Greece"> Greece </option>

                        <option value="Greenland"> Greenland </option>

                        <option value="Grenada"> Grenada </option>

                        <option value="Guadeloupe"> Guadeloupe </option>

                        <option value="Guam"> Guam </option>

                        <option value="Guatemala"> Guatemala </option>

                        <option value="Guernsey"> Guernsey </option>

                        <option value="Guinea"> Guinea </option>

                        <option value="Guinea-Bissau"> Guinea-Bissau </option>

                        <option value="Guyana"> Guyana </option>

                        <option value="Haiti"> Haiti </option>

                        <option value="Honduras"> Honduras </option>

                        <option value="Hong Kong"> Hong Kong </option>

                        <option value="Hungary"> Hungary </option>

                        <option value="Iceland"> Iceland </option>

                        <option value="India"> India </option>

                        <option value="Indonesia"> Indonesia </option>

                        <option value="Iran"> Iran </option>

                        <option value="Iraq"> Iraq </option>

                        <option value="Ireland"> Ireland </option>

                        <option value="Israel"> Israel </option>

                        <option value="Italy"> Italy </option>

                        <option value="Jamaica"> Jamaica </option>

                        <option value="Japan"> Japan </option>

                        <option value="Jersey"> Jersey </option>

                        <option value="Jordan"> Jordan </option>

                        <option value="Kazakhstan"> Kazakhstan </option>

                        <option value="Kenya"> Kenya </option>

                        <option value="Kiribati"> Kiribati </option>

                        <option value="North Korea"> North Korea </option>

                        <option value="South Korea"> South Korea </option>

                        <option value="Kosovo"> Kosovo </option>

                        <option value="Kuwait"> Kuwait </option>

                        <option value="Kyrgyzstan"> Kyrgyzstan </option>

                        <option value="Laos"> Laos </option>

                        <option value="Latvia"> Latvia </option>

                        <option value="Lebanon"> Lebanon </option>

                        <option value="Lesotho"> Lesotho </option>

                        <option value="Liberia"> Liberia </option>

                        <option value="Libya"> Libya </option>

                        <option value="Liechtenstein"> Liechtenstein </option>

                        <option value="Lithuania"> Lithuania </option>

                        <option value="Luxembourg"> Luxembourg </option>

                        <option value="Macau"> Macau </option>

                        <option value="Macedonia"> Macedonia </option>

                        <option value="Madagascar"> Madagascar </option>

                        <option value="Malawi"> Malawi </option>

                        <option value="Malaysia"> Malaysia </option>

                        <option value="Maldives"> Maldives </option>

                        <option value="Mali"> Mali </option>

                        <option value="Malta"> Malta </option>

                        <option value="Marshall Islands"> Marshall Islands </option>

                        <option value="Martinique"> Martinique </option>

                        <option value="Mauritania"> Mauritania </option>

                        <option value="Mauritius"> Mauritius </option>

                        <option value="Mayotte"> Mayotte </option>

                        <option value="Mexico"> Mexico </option>

                        <option value="Micronesia"> Micronesia </option>

                        <option value="Moldova"> Moldova </option>

                        <option value="Monaco"> Monaco </option>

                        <option value="Mongolia"> Mongolia </option>

                        <option value="Montenegro"> Montenegro </option>

                        <option value="Montserrat"> Montserrat </option>

                        <option value="Morocco"> Morocco </option>

                        <option value="Mozambique"> Mozambique </option>

                        <option value="Myanmar"> Myanmar </option>

                        <option value="Nagorno-Karabakh"> Nagorno-Karabakh </option>

                        <option value="Namibia"> Namibia </option>

                        <option value="Nauru"> Nauru </option>

                        <option value="Nepal"> Nepal </option>

                        <option value="Netherlands"> Netherlands </option>

                        <option value="Netherlands Antilles"> Netherlands Antilles </option>

                        <option value="New Caledonia"> New Caledonia </option>

                        <option value="New Zealand"> New Zealand </option>

                        <option value="Nicaragua"> Nicaragua </option>

                        <option value="Niger"> Niger </option>

                        <option value="Nigeria"> Nigeria </option>

                        <option value="Niue"> Niue </option>

                        <option value="Norfolk Island"> Norfolk Island </option>

                        <option value="Turkish Republic of Northern Cyprus"> Turkish Republic of Northern Cyprus </option>

                        <option value="Northern Mariana"> Northern Mariana </option>

                        <option value="Norway"> Norway </option>

                        <option value="Oman"> Oman </option>

                        <option value="Pakistan"> Pakistan </option>

                        <option value="Palau"> Palau </option>

                        <option value="Palestine"> Palestine </option>

                        <option value="Panama"> Panama </option>

                        <option value="Papua New Guinea"> Papua New Guinea </option>

                        <option value="Paraguay"> Paraguay </option>

                        <option value="Peru"> Peru </option>

                        <option value="Philippines"> Philippines </option>

                        <option value="Pitcairn Islands"> Pitcairn Islands </option>

                        <option value="Poland"> Poland </option>

                        <option value="Portugal"> Portugal </option>

                        <option value="Puerto Rico"> Puerto Rico </option>

                        <option value="Qatar"> Qatar </option>

                        <option value="Romania"> Romania </option>

                        <option value="Russia"> Russia </option>

                        <option value="Rwanda"> Rwanda </option>

                        <option value="Saint Barthelemy"> Saint Barthelemy </option>

                        <option value="Saint Helena"> Saint Helena </option>

                        <option value="Saint Kitts and Nevis"> Saint Kitts and Nevis </option>

                        <option value="Saint Lucia"> Saint Lucia </option>

                        <option value="Saint Martin"> Saint Martin </option>

                        <option value="Saint Pierre and Miquelon"> Saint Pierre and Miquelon </option>

                        <option value="Saint Vincent and the Grenadines"> Saint Vincent and the Grenadines </option>

                        <option value="Samoa"> Samoa </option>

                        <option value="San Marino"> San Marino </option>

                        <option value="Sao Tome and Principe"> Sao Tome and Principe </option>

                        <option value="Saudi Arabia"> Saudi Arabia </option>

                        <option value="Senegal"> Senegal </option>

                        <option value="Serbia"> Serbia </option>

                        <option value="Seychelles"> Seychelles </option>

                        <option value="Sierra Leone"> Sierra Leone </option>

                        <option value="Singapore"> Singapore </option>

                        <option value="Slovakia"> Slovakia </option>

                        <option value="Slovenia"> Slovenia </option>

                        <option value="Solomon Islands"> Solomon Islands </option>

                        <option value="Somalia"> Somalia </option>

                        <option value="Somaliland"> Somaliland </option>

                        <option value="South Africa"> South Africa </option>

                        <option value="South Ossetia"> South Ossetia </option>

                        <option value="Spain"> Spain </option>

                        <option value="Sri Lanka"> Sri Lanka </option>

                        <option value="Sudan"> Sudan </option>

                        <option value="Suriname"> Suriname </option>

    Page URL:
    http://form.jotform.co/form/33214227842853

    right align form class JotForm textarea checkbox french
  • Profile Image
    JotForm Support

    Answered by ardy0689 on November 18, 2013 at 03:32 PM

    Hello, we apologize for this inconvenience.

    JotForm works heavily using Javascript. Unfortunately, no email provider or email client supports Javascript due to security reasons. This is why we do not recommend embedding your form inside an email notification as it breaks JotForm code or sometimes become unresponsive. To add this further, any Javascript code that is embedded in an email will usually be marked as spam by most email providers or will reject it.

    If you would like to continue, you may choose to add this inline CSS on each of the <li> tag that you see on your embed code.

    style="list-style:none;background-image:none;"

    example everytime you see an <li tag

    <li class="form-line form-line-column" id="id_4">

    add the style on the <li like this:

    <li style="list-style:none;background-image:none;"  class="form-line form-line-column" id="id_4">

     

    Similarly, when you find an <ul add this inline CSS on your email notification

    style="list-style-type:none;padding:0px;margin:0px"

    example when you see this <ul tag

    <ul class="form-section">

    change it to:

    <ul style="list-style-type:none;padding:0px;margin:0px"  class="form-section">

    The bullets should now be cleared. Here is your embed code. I already inserted every inline CSS

    http://pastiebin.com/528a77fd288e0

    However, we can not guarantee that your form will behave properly 100% as there is no Javascript working when your recipients receive this.

    If you need further assistance, please do not hesitate to reach us. You could also open up a new thread for another inquiry. Thank you

  • Profile Image

    Answered by AllyatCoates on November 18, 2013 at 03:42 PM

    Wow, you guys are fantastic! Thanks!


  • Profile Image

    Answered by AllyatCoates on November 18, 2013 at 03:43 PM

    Whoops, I think I got someone else's embed code, but I will make the changes in my own code. 

  • Profile Image
    JotForm Support

    Answered by ardy0689 on November 18, 2013 at 03:52 PM

    Thanks for the update. Please let us know if you got stucked along the way. Thank you