Create line spaces in between text in HTML

Anonymous
Not applicable

Create line spaces in between text in HTML

Upon building my email in HTML I noticed that my <div> text content bunches up together in Text form version of the email. I tried putting in a <br> between each text content and it still didn't work. Is there way to create line space in my HTML to make each line of text separate? 
Tags (1)
12 REPLIES 12
Anonymous
Not applicable

Re: Create line spaces in between text in HTML

Hey Nio,

I have found that if you press enter to go to the next line, then tab over a couple of times, and then hit enter again, the space will stay. If you try this and save and still don't see the break, go back into the editor one more time and try again. I'm not sure why it works, but it has for me in the past.
Anonymous
Not applicable

Re: Create line spaces in between text in HTML

So in my HTML, under the body of text area 

- Press enter to shift the text to the next line
- Tab a couple time over
- Press enter 

If I it doesn't work, repeat the same process again.

So in the end when looking at my code I will have a gigantic area of space just to create a line of text for the text form?
Anonymous
Not applicable

Re: Create line spaces in between text in HTML

I'm sorry, I meant to do that process in the editor, not in the code. It's not ideal, but it has worked for me.
Anonymous
Not applicable

Re: Create line spaces in between text in HTML

Is there a way I can implement that in the HTML code so the user doesn't have to do that in the template?
Eric_Salamon1
Level 6

Re: Create line spaces in between text in HTML

I think your html may be written wrong for line break. </br> has been working for me whenever I need to add a line break. dont forget the backslash it is very important to mean to cut the line.
Anonymous
Not applicable

Re: Create line spaces in between text in HTML

There you go, I would definitely try Eric's suggestion.
Eric_Salamon1
Level 6

Re: Create line spaces in between text in HTML

also if you don't want the user to be able to change your template but you do want them to edit some of the specific text you can always use <span class="mkteditable" id="anything_you_want"> ( this will allow only the information in the span to be edited</span></br><span class="mkteditable" id="anything_you_want2">now the brake can not be changed</span>
Anonymous
Not applicable

Re: Create line spaces in between text in HTML

In HTML code view using a <br> will only add one return. If you want each line of text in your emails to have a space between them you can either use two <br>'s or use a <p></p> tag. The <p> tag is for paragraph and will seperate out the text for you.

Example of <br>
Text goes right under.

Example of <p></p>

<p>Text gets an extra space as in a start of a new paragraph.</p>
<p>new paragraph</p>

In your code it looks like there is no space between the two <p> tags but when you view the email in design view or in a test the two paragraph tags will make both lines of text appear to be spaced out acting like a double space or a new paragraph.

Does this help answer your question? You can also paste your HTML into the reply and I can take a look at it to give you a better answer and understanding of what you are trying to do.
Anonymous
Not applicable

Re: Create line spaces in between text in HTML

Here is my code where I am trying to create a text line space in my HTML. It looks good visually but when it comes to text form its all bunched up together. So I took your advice as  to using the <p> tags but unsure if my placement was correct.

Here take a look

      <!-- content -->
      <div class="content">
        <table class="twelve columns mktEditable" id="center-content">
          <tr>
            <td style="margin:0px 0px 10px 0px;">
              
              <p class="lead" style="text-align: center;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</p>
              
              <!-- A Real Hero (and a real human being) -->
              <p><img src="http://na-ab03.marketo.com/rs/the451group/images/580x195_box.jpg" alt="image"/></p><!-- /hero -->
              <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
            </td>
          </tr>
        </table>
 
        <table class="button" style="width:50%; margin: 0px auto 20px auto;">
          <tr>
            <td style="border: 1px solid #6F1200">
              <a class="mktEditable" id="button_title" href="#">Read the full press release</a>
            </td>
          </tr>
        </table>          
      </div>
      <!-- /content -->
 
     <hr align="center" width="580px" style="background-color:#4d4f53; margin-bottom:0px;">
 
     <!-- /content -->
      <div class="content">
        <table bgcolor="#EEEEEE" align="center" width="580px">
          <tr>
            <td>
              
              <!-- Achievements -->
              <table class="social">
                <tr>
                  <td>
 
                    <div class="content">
                      <table class="mktEditable" id="achievements">
                        <tr>
                          <td>
                          <p>&nbsp;</p>
                          <h6 style="margin: -10px 0px 0px 25px;"><strong>Achievements</strong></h6>
                            
                          <p class="" style="color:#4D4F53; margin:10px 0px 0px 25px;">
                          <strong>Subject Text:</strong><br>
                          <a href="#">Text Link</a><br>
                          <a href="#">Text Link</a><br>
                          <a href="#">Text Link</a><br>
                          </p>
 
                          <p class="" style="color:#4D4F53; margin: 10px 0px 20px 25px;">
                          <strong>Subject Text:</strong><br>
                          <a href="#">Text Link</a><br>
                          <a href="#">Text Link</a><br>
                          <a href="#">Text Link</a><br>
                          </p>               
                            
                          </td>
 
                        </tr>
                      </table>
                    </div>
                    
                    
                    <div class="clear"></div>
  
                  </td>
                </tr>
              </table>
              <!-- Achievements -->
              
            </td>
          </tr>
        </table>
      </div>
      <!-- /content -->
 
      <hr align="center" width="580px" style="background-color:#4d4f53; margin-top:0px;">