Re: Create line spaces in between text in HTML

Anonymous · ‎07-16-2014

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?

Eric_Salamon1 · ‎07-17-2014

Ok so you know the table that the achievements are in all you have done was increase the spacing from the top of the achievements and the top bar. if you want the spacing to be between the read the full press release and the achievemtns box you will need to add another table and </br> to seperate that.

Anonymous · ‎07-17-2014

Sorry, I fogot to mention that I'm trying to separate the  and . I thought by doing that I would put a <p>&nbsp:</p> on top of <h6> tag for the word "Achievements"

Did I do that right?

Eric_Salamon1 · ‎07-17-2014

I only added one more table so that the text would be limited to the size of the email. additionally for the class you want to make sure to have mkteditable by itself in the class.

<tr>

<td>

<tr>

<p class="mktEditable" id="other" style="text-align: center;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</p>

<p class="mktEditable" id="other1" >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>

<tr>

<a class="mktEditable" id="button_title" href="#">Read the full press release</a>

</td>

</tr>

</table>

</div>

<tr>

<td>

<tr>

<td>

<tr>

<td>

<h6 style="margin: -10px 0px 0px 25px;"><strong>Achievements</strong></h6>

<strong>Subject Text:</strong><br>

</p>

<strong>Subject Text:</strong><br>

</p>

</td>

</tr>

</table>

</div>

</td>

</tr>

</table>

</td>

</tr>

</table>

</div>

</td>

</tr>

</table>

PS.. you also want to be careful with margins because some email clients don't like them **Cough cough Microsoft cough cough**

Anonymous · ‎07-17-2014

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

<tr>

<p class="lead" style="text-align: center;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</p>

<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>

<tr>

<a class="mktEditable" id="button_title" href="#">Read the full press release</a>

</td>

</tr>

</table>

</div>

<tr>

<td>

<tr>

<td>

<tr>

<td>

<h6 style="margin: -10px 0px 0px 25px;"><strong>Achievements</strong></h6>

<strong>Subject Text:</strong><br>

</p>

<strong>Subject Text:</strong><br>

</p>

</td>

</tr>

</table>

</div>

</td>

</tr>

</table>

</td>

</tr>

</table>

</div>

Anonymous · ‎07-17-2014

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.

Eric_Salamon1 · ‎07-16-2014

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 · ‎07-16-2014

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

Eric_Salamon1 · ‎07-16-2014

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 · ‎07-16-2014

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

Anonymous · ‎07-16-2014

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 · ‎07-16-2014

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 · ‎07-16-2014

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.