Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

white-space: pre-line alternative for Outlook

I have to wrap some email text content in a <pre> tag so that the formatting keeps the line breaks but collapses unnecessary spaces.

What I need is exactly the following:

<pre style="white-space: pre-line">Text here</pre>

This works perfectly on the browser BUT, pre-line is not supported by outlook. That means, that I have to use 'pre-wrap' which respects the line breaks but keeps some really big unwanted spaces, which the client does not want.

I can't edit the content of the text (like adding a </br>), as it is generated by an external system, which does not allow any editing...

I also tried the following:

white-space: normal;
white-space: nowrap;
white-space: pre;
white-space: pre-wrap;
white-space: break-spaces;

I also tried to use a div, instead of a <pre> tag, and also the <xmp> tag with white-space: pre-wrap and pre-line, <wbr> tag with same settings, but nothing gave me the expected results.

This is the code, which I insert into the external system:

<pre style="white-space: pre-line"><&MEETING_INFO></pre>

The code runs through an external system which generates the complete text which I cannot access. This is an example of a full code, including text after it is generated by the external system and sent to Outlook:

<pre style="white-space: pre-line">
    Beginn:      27.05.2019 10:00 US/Eastern
    Ende:        27.05.2019 11:00 US/Eastern
    Kursleiter: Mustermann, Max
    Einrichtung:   Building A
    Veranstaltungsraum:   BC 33 - Raum 3.07 - Berlin
</pre>

Actual results as displayed in Outlook:

<pre style="white-space: pre-line">
    Beginn: 27.05.2019 10:00 US/Eastern Ende: 27.05.2019 11:00 US/Eastern
    Kursleiter: Mustermann, Max Einrichtung: Building A Veranstaltungsraum: BC 33 - Raum 3.07 - Berlin
</pre>

How it should be:

<pre style="white-space: pre-line">
    Beginn: 27.05.2019 10:00 US/Eastern
    Ende: 27.05.2019 11:00 US/Eastern
    Kursleiter: Mustermann, Max
    Einrichtung: Building A
    Veranstaltungsraum: BC 33 - Raum 3.07 - Berlin
</pre>

I tried everything and I'm desperate. Is there ANY alternative?? Many thanks for any help!

like image 631
lalaMobs Avatar asked Jun 24 '19 14:06

lalaMobs


People also ask

What is white space pre?

pre. Whitespace is preserved by the browser. Text will only wrap on line breaks. Acts like the <pre> tag in HTML.

What is the difference between the pre and pre line options?

pre : Same results as using the <pre> where all the whitespaces will be kept as is and the text only wraps when line breaks are in the content. pre-line : Multiple whitespaces are collapsed into one, the text breaks to the next line when needed or with line breaks in the content.

What is white space collapsing?

White space refers to empty or blank values in the code which the browser reads and renders. Html has a special feature of collapsing these white spaces. If you put extra/consecutive white spaces or newlines in the code it will regard it as one white space this is known as collapsing of white spaces.

How do you put a space before text in CSS?

In CSS, you can use either the margin or padding properties to add space around elements. Additionally, the text-indent property adds space to the front of the text, such as for indenting paragraphs.


1 Answers

Outlooks doesn't like most code so a walk around would be to simulate the code for pre. Below is an example of how you can do it

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tbody>
    <tr>
      <td style="font-family: monospace;font-size:13px;color:#000001;">
	Beginn: 27.05.2019 10:00 US/Eastern<br>
    Ende: 27.05.2019 11:00 US/Eastern<br>
    Kursleiter: Mustermann, Max<br>
    Einrichtung: Building A<br>
    Veranstaltungsraum: BC 33 - Raum 3.07 - Berlin
		</td>
    </tr>
  </tbody>
</table>

Rest of you HTML can go around it.

like image 193
Syfer Avatar answered Nov 09 '22 23:11

Syfer