• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1924
  • Last Modified:

Wrap text in html email

I need to set a fixed width or wrap the text in an html email so that it doesn't keep stretching across the page when a large amount of text is entered into a textarea.
0
vetted
Asked:
vetted
  • 6
  • 6
1 Solution
 
LotokCommented:
<div style="width:800px;">
<p> YOUR TEXT HERE </p>
</div>

The above markup would wrap the paragraph at 800px long. You can change that number to what suits.
0
 
vettedAuthor Commented:
That didn't work for me.  The field value is inside of a table. Here's my code with what you gave me.

<tr><td><div style="width:300px;"><p>ff<conviction></p></div></td></tr>
0
 
LotokCommented:
Divs are used instead of a table layout. if you are using tables then just set the width on the td.
<tr>
<td style="width:800px;">
TEXT
</td>
</tr>
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
vettedAuthor Commented:
This is still not working.  Am I missing something else?

<table width="600" border="0" align="center" cellspacing="0" bgcolor="C4B584" style="padding: 2px 0px 2px 20px;">
<tr><td style="width:300px;">ff<conviction></td></tr>
</table>
0
 
LotokCommented:
Ah ok. You are using HTML 4.0!
the Style tag is a CSS property, I was assumung XHTML 1.0

See below document.You need content to see the wrapping, hence the lorem ipsum.
I set one TD to 400 which forces the other to 200 as the table is 600.


<html>
<head>
</head>
<body>
 
<table width="600" border="0" align="center" cellspacing="0" bgcolor="C4B584" style="padding: 2px 0px 2px 20px;">
<tr>
<td width="400">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 
 
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it 
 
to make a type specimen book. It has survived not only five centuries, but also the leap into electronic 
 
typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets 
 
containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including 
 
versions of Lorem Ipsum.
</td>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's 
 
standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a 
 
type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, 
 
remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing 
 
Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of 
 
Lorem Ipsum.
</td>
</tr>
 
</table>
 
</body>
</html>

Open in new window

0
 
vettedAuthor Commented:
I used that code previously and it didn't work.  I don't care if I use HTML 4.0 or XHTML, I just need it to work.

For this form, if a person has a criminal record, he/she has to enter the details.  On the form, there is no problem. The text is wrapping in the text area field.  The issue is in the submission email.  That text is what is stretching the page.  The Form and HTML Email Template are below (Form code first then email).

FYI - The style="padding: 2px 20px 0px 20px;" in the HTML email template is working....if that's any consolation.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
<title>Employment Application</title>
 
<META name="description" content="" />
<META name="keywords" content="" />
<META name="author" content="" />
<SCRIPT language="JavaScript">
var TlxPgNm='welcome';
</SCRIPT>
<link rel="stylesheet" href="emp_app.css" />
</head>
 
<!--Content Here -->
 
<body>
 
<br />
<table width="600" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="C4B584">
	
		 
<tr><td><br />
<h2>Instructions:</h2>
<p> 1) Fields marked with <span class="style5">*</span> are required.</p>
<p> 2) If answer is unknown, leave blank unless required.</p>
<p> 3) It is highly recommended to upload your Resume/CV.</p>
<p> 4) When form is completed, you must click the Submit button.  You will receive a confirmation via email.</p>
</td></tr>
 
<tr><td><img src="../images/white_divider.jpg" /><br /><br /></td></tr>
</table>
<table width="600" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="C4B584">
	<form action="emp_app_script.php" method="post" enctype="multipart/form-data">
    <tr>
<td>Position Applied For:</td><td><input name="position" type="text" value="" size="25"></td>
<td>Available Start Date:</td><td><input name="start_date" type="text" value="" size="13"></td>
</tr>
 <tr><td colspan="4"><br /><img src="../images/white_divider.jpg" /><br /></td></tr>
</table>
<table width="600" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="C4B584"> 
   <tr>
    <td width="425"><div align="left"><span class="style5">*</span>Have you ever been convicted of or charged with a felony or misdemeanor?</div></td>
    <td width="150"><input type="radio" name="conviction" value="yes" checked> Yes &nbsp; <input type="radio" name="conviction" value="no" checked> No</td>
  </tr> 
   <tr>
    <td colspan="2" align="left"><br />If yes, please explain details in full, including dates, details of offense(s) charged, jurisdiction, and disposition of case:</td></tr>
    <tr><td colspan="2" align="left"><textarea name="conviction_details" cols="69" rows="6"></textarea><br /><br /></td>
   </tr>
</table>
</body></html>
 
 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
<title>Employment Application Submission</title>
 
<link rel="stylesheet" href="https://mysite.com/emp_app_email.css" />
 
</head>
<!--Content Here -->
<body>
 
<br />
<table width="600" border="0" align="center" cellspacing="0" bgcolor="C4B584">	
<tr><td width="407" style="padding: 0px 0px 0px 8px;"><br /><h2>Employment Application Submission</h2></td></tr>
				
<tr><td style="padding: 8px 0px 0px 20px;"><h3>Below are the details of a contractor application that has been submitted.</h3></td></tr>
<br />
</table>
 
<table width="600" border="0" align="center" cellspacing="0" bgcolor="C4B584" style="padding: 2px 0px 2px 20px;">	
<tr><td colspan="2" align="center"><img src="https://mysite.com/images/white_divider.jpg" /><br /><br /></td></tr>
 
<tr><td width="181" style="padding: 0px 0px 0px 20px;"><h4>Position Applied for::</h4></td><td width="403" style="padding: 0px 0px 0px 0px;">ff<position>
<tr><td width="181" style="padding: 0px 0px 12px 20px;"><h4>Available Start Date:</h4></td><td width="403" style="padding: 0px 0px 12px 0px;">ff<start_date></td></tr>
 
</table>
 
 
<table width="600" border="0" align="center" cellspacing="0" bgcolor="C4B584" style="padding: 2px 0px 2px 20px;">
<tr><td width="550"><h4>Have you ever been convicted of or charged with a felony or misdemeanor?</h4></td></tr>
<tr><td width="550">ff<conviction></td></tr>
<tr><td style="padding: 2px 20px 0px 20px;" width="550"><h4>If yes, please explain details in full, including dates, details of offense(s) charged, jurisdiction, and disposition of case:</h4></td></tr>
<tr><td width="550">ff<conviction_details></td></tr>
<tr><td width="550" style="padding: 2px 20px 0px 20px;"><h4>Have you, or any person or entity with whom you have been associated with, filed for bankruptcy, been decalred bankrupt or insolvent, or been the subject of any receivership proceedigns within the last 7 years?</h4></td></tr>
<tr><td width="550">ff<bankruptcy></td></tr>
<tr><td width="550" style="padding: 2px 0px 8px 20px;"><h4>If yes,please provide full details, including dates, places, amounts involved, and dispositon:</h4></td></tr>
<tr><td width="550">ff<bankruptcy_details></td></tr>
</table>
</body></html>

Open in new window

0
 
LotokCommented:
What browser are you using? Wrapping in IE7 anf FF but having colour problems in FF.
Are you wanting this to be cross browser compliant?

I have just finished work, if you can wait I will recreate it tomorrow in XHTML with cross browser support.
0
 
vettedAuthor Commented:
It's the email that's having the problem. The results of the form are sent in an email, not in the browser.  I am using Outlook 2007.
0
 
LotokCommented:
I opened up your email in outlook 2007 and attached screenshot of what I see.
Can you post a screenshot of what you see as the text does wrap on mine...


email.jpg
0
 
vettedAuthor Commented:
Try typing more text in the textarea and see if it wraps.  You have only typed ff in those fields.  It's the answers that are making it stretch.
0
 
LotokCommented:
I have been reading this:
http://msdn.microsoft.com/en-us/library/aa338201.aspx

Outlook 2007 is extremely limited on how much HTML it undertands. Hate to say I am struggling to beat this one as well. All the properties you would usually use are unsupported.
0
 
vettedAuthor Commented:
I have to close this question, it's still not fixed.  You get the points for trying. Thanks.
0

Featured Post

Upgrade your Question Security!

Add Premium security features to your question to ensure its privacy or anonymity. Learn more about your ability to control Question Security today.

  • 6
  • 6
Tackle projects and never again get stuck behind a technical roadblock.
Join Now