How can I display this image in velocity template?
Is there any configuration required to display image?
I have java configuration for velocity.
Please help me.
Thanks in advance.
Thank you very much for your kind reply glw, issue already fixed. I forgot that email template takes only live images path which are deployed, not local project paths like src="${pageContext.request.contextPath}/resources/images/.jpg" Issue is fixed by src="www..com/images/.jpg".
I'm using base 64 image to populate data, the code for template is
<!DOCTYPE html>
<html>
<body style="margin:0;">
<table width="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="max-width: 640px; border: 1px solid #dfdfdf; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; letter-spacing: 0.5px; color: #404040;">
<tr>
<td valign="top" style="padding: 30px 20px 20px;">
<table width="100%" cellpadding="0" cellspacing="0" bgcolor="#fff" style="border-collapse:collapse;border:1px solid #808080;">
<tr>
<td align="left" valign="top" style="padding: 10px; border: 1px solid #808080; color: #808080;">Address</td>
<td align="right" valign="top" style="padding: 10px; border: 1px solid #808080; color: #404040; font-weight: bold;">${address}</td>
</tr>
<tr>
<td align="left" valign="top" style="padding: 10px; border: 1px solid #808080; color: #404040; font-weight: bold;">Aadharphoto</td>
<td align="right" valign="top" style="padding: 10px; border: 1px solid #808080; color: #404040; font-weight: bold;">
<img src = 'data:image/png;base64,${photo}' alt="Aadharphoto" style="width:300px"/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
code to populate template
Map<String, String> templatedata = eData(response);
/*Map<String, String> templatedata = new HashMap<>();
templatedata.put("address", response.getAddress());
templatedata.put("photo", response.getBase64Photo()); //iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==
[![enter image description here][1]][1]*/
public String createContent(EmailTemplate template, Map<String, String> data) {
return VelocityEngineUtils.mergeTemplateIntoString(velocityEngine, template.getFileName(), objectMap);
}
output image : https://i.stack.imgur.com/wvloX.png
Related
I need to dynamically add rows to my table, when I add some data in vue component. I am using v-for it must automatically add rows after adding data, but it doesn't show me anything, just a table header.
<table style="width: 95%;" cellspacing="0" id="main2">
<tbody>
<tr>
<th style="width: 55%; background-color: #343434; color: #FFFFFF; text-align: left; font-weight: normal; "><span class="target-field" data-path="name_word_output">Назва</span></th>
<th style="width: 15%; background-color: #343434; color: #FFFFFF; text-align: center; font-weight: normal;"><span class="target-field" data-path="quantity_word_output">Кількість</span></th>
<th style="width: 15%; background-color: #343434; color: #FFFFFF; text-align: center; font-weight: normal;"><span class="target-field" data-path="rate_word_output">Вартість</span></th>
<th style="width: 15%; background-color: #343434; color: #FFFFFF; text-align: center; font-weight: normal;"><span class="target-field" data-path="amount_word_output">Разом</span></th>
</tr>
<tr v-for="item in rowData">
<td style="border: 1px solid #ddd;"><span class="target-field" data-path="issue.name">{{item.tovarname}}</span></td>
<td style="border: 1px solid #ddd; text-align: center;"><span class="target-field" data-path="issue.quantity"></span> <span class="target-field" data-path="issue.unit">{{item.fakturahowmany}}</span></td>
<td style="border: 1px solid #ddd; text-align: center;"><span class="target-field" data-path="currency_type_output">₴</span> <span class="target-field" data-path="issue.price_per_one">{{item.fakturaprice}}</span></td>
<td style="border: 1px solid #ddd; text-align: center;"><span class="target-field" data-path="currency_type_output">₴</span> <span class="target-field" data-path="issue.amount">{{item.fakturahowmany*item.fakturaprice}}</span></td>
</tr>
</tbody>
</table>
and another part
methods: {
addItem(){
this.$root.totalprice+=this.$root.fakturahowmany*this.$root.fakturaprice;
var my_object = {
tovarname:this.$root.tovarname,
fakturahowmany:this.$root.fakturahowmany,
fakturaprice:this.$root.fakturaprice,
};
this.$root.rowData.push(my_object)
//
this.$root.tovarname = 1;
this.$root.fakturahowmany = 1;
this.$root.fakturaprice = 1;
}
}
}
How can I fix it? Thanks!
You have to start a unique key for the items through v-bind: key = "item.id" in your v-for
<tr v-for="item in rowData" v-bind:key="item.id" >
link: https://v2.vuejs.org/v2/guide/list.html#Maintaining-State
I want to get email body from in html format,
defaults = {
'name': msg.get('subject') or _("No Subject"),
'email_from': msg.get('from'),
'email_cc': msg.get('cc'),
'partner_id': msg.get('author_id', False),
'description': msg.get('body'),
}
I want to get email body to description but when I use 'description': msg.get('body'), it takes all on text format,
I want to get email body on HTML format
<html xmlns="https://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><head>
<!--[if gte mso 9]><xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml><![endif]-->
<title>Christmas Email template</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0 ">
<meta name="format-detection" content="telephone=no">
<!--[if !mso]><!-->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800" rel="stylesheet">
<!--<![endif]-->
<style type="text/css">
body {
margin: 0 !important;
padding: 0 !important;
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
-webkit-font-smoothing: antialiased !important;
}
img {
border: 0 !important;
outline: none !important;
}
p {
Margin: 0px !important;
Padding: 0px !important;
}
table {
border-collapse: collapse;
mso-table-lspace: 0px;
mso-table-rspace: 0px;
}
td, a, span {
border-collapse: collapse;
mso-line-height-rule: exactly;
}
.ExternalClass * {
line-height: 100%;
}
.em_defaultlink a {
color: inherit !important;
text-decoration: none !important;
}
span.MsoHyperlink {
mso-style-priority: 99;
color: inherit;
}
span.MsoHyperlinkFollowed {
mso-style-priority: 99;
color: inherit;
}
#media only screen and (min-width:481px) and (max-width:699px) {
.em_main_table {
width: 100% !important;
}
.em_wrapper {
width: 100% !important;
}
.em_hide {
display: none !important;
}
.em_img {
width: 100% !important;
height: auto !important;
}
.em_h20 {
height: 20px !important;
}
.em_padd {
padding: 20px 10px !important;
}
}
#media screen and (max-width: 480px) {
.em_main_table {
width: 100% !important;
}
.em_wrapper {
width: 100% !important;
}
.em_hide {
display: none !important;
}
.em_img {
width: 100% !important;
height: auto !important;
}
.em_h20 {
height: 20px !important;
}
.em_padd {
padding: 20px 10px !important;
}
.em_text1 {
font-size: 16px !important;
line-height: 24px !important;
}
u + .em_body .em_full_wrap {
width: 100% !important;
width: 100vw !important;
}
}
</style>
</head>
<body class="em_body" style="margin:0px; padding:0px;" bgcolor="#efefef">
<table class="em_full_wrap" valign="top" width="100%" cellspacing="0" cellpadding="0" border="0" bgcolor="#efefef" align="center">
<tbody><tr>
<td valign="top" align="center"><table class="em_main_table" style="width:700px;" width="700" cellspacing="0" cellpadding="0" border="0" align="center">
<!--Header section-->
<tbody><tr>
<td style="padding:15px;" class="em_padd" valign="top" bgcolor="#f6f7f8" align="center"><table width="100%" cellspacing="0" cellpadding="0" border="0" align="center">
<tbody><tr>
<td style="font-family:'Open Sans', Arial, sans-serif; font-size:12px; line-height:15px; color:#0d1121;" valign="top" align="center">Test Email Sample | View Online</td>
</tr>
</tbody></table></td>
</tr>
<!--//Header section-->
<!--Banner section-->
<tr>
<td valign="top" align="center"><table width="100%" cellspacing="0" cellpadding="0" border="0" align="center">
<tbody><tr>
<td valign="top" align="center"><img class="em_img" alt="merry Christmas" style="display:block; font-family:Arial, sans-serif; font-size:30px; line-height:34px; color:#000000; max-width:700px;" src="images/05be8b57-6b90-4ebd-ba17-4014c79f2e4b.jpg" width="700" border="0" height="345"></td>
</tr>
</tbody></table></td>
</tr>
<!--//Banner section-->
<!--Content Text Section-->
<tr>
<td style="padding:35px 70px 30px;" class="em_padd" valign="top" bgcolor="#0d1121" align="center"><table width="100%" cellspacing="0" cellpadding="0" border="0" align="center">
<tbody><tr>
<td style="font-family:'Open Sans', Arial, sans-serif; font-size:16px; line-height:30px; color:#ffffff;" valign="top" align="center">This is a sample email which shall be accommodated in a single paragraph</td>
</tr>
<tr>
<td style="font-size:0px; line-height:0px; height:15px;" height="15"> </td>
<!--—this is space of 15px to separate two paragraphs ---->
</tr>
<tr>
<td style="font-family:'Open Sans', Arial, sans-serif; font-size:18px; line-height:22px; color:#fbeb59; letter-spacing:2px; padding-bottom:12px;" valign="top" align="center">This is paragraph 2 of font size 18px and #fbeb59 font color with a line spacing of 15px</td>
</tr>
<tr>
<td class="em_h20" style="font-size:0px; line-height:0px; height:25px;" height="25"> </td>
<!--—this is space of 25px to separate two paragraphs ---->
</tr>
<tr>
<td style="font-family:'Open Sans', Arial, sans-serif; font-size:18px; line-height:22px; color:#fbeb59; text-transform:uppercase; letter-spacing:2px; padding-bottom:12px;" valign="top" align="center"> This is paragraph 3 of font size 18px and #fbeb59 font color with a line spacing of 25px and Uppercase</td>
</tr>
</tbody></table></td>
</tr>
<!--//Content Text Section-->
<!--Footer Section-->
<tr>
<td style="padding:38px 30px;" class="em_padd" valign="top" bgcolor="#f6f7f8" align="center"><table width="100%" cellspacing="0" cellpadding="0" border="0" align="center">
<tbody><tr>
<td style="padding-bottom:16px;" valign="top" align="center"><table cellspacing="0" cellpadding="0" border="0" align="center">
<tbody><tr>
<td valign="top" align="center"><img src="images/fb.png" alt="fb" style="display:block; font-family:Arial, sans-serif; font-size:14px; line-height:14px; color:#ffffff; max-width:26px;" width="26" border="0" height="26"></td>
<td style="width:6px;" width="6"> </td>
<td valign="top" align="center"><img src="images/tw.png" alt="tw" style="display:block; font-family:Arial, sans-serif; font-size:14px; line-height:14px; color:#ffffff; max-width:27px;" width="27" border="0" height="26"></td>
<td style="width:6px;" width="6"> </td>
<td valign="top" align="center"><img src="images/yt.png" alt="yt" style="display:block; font-family:Arial, sans-serif; font-size:14px; line-height:14px; color:#ffffff; max-width:26px;" width="26" border="0" height="26"></td>
</tr>
</tbody></table></td>
</tr>
<tr>
<td style="font-family:'Open Sans', Arial, sans-serif; font-size:11px; line-height:18px; color:#999999;" valign="top" align="center">PRIVACY STATEMENT | TERMS OF SERVICE | RETURNS<br>
© 2017 Companyname. All Rights Reserved.<br>
If you do not wish to receive any further emails from us, please unsubscribe</td>
</tr>
</tbody></table></td>
</tr>
<tr>
<td class="em_hide" style="line-height:1px;min-width:700px;background-color:#ffffff;"><img alt="" src="images/spacer.gif" style="max-height:1px; min-height:1px; display:block; width:700px; min-width:700px;" width="700" border="0" height="1"></td>
</tr>
</tbody></table></td>
</tr>
</tbody></table>
<div class="em_hide" style="white-space: nowrap; display: none; font-size:0px; line-height:0px;"> </div>
</body></html>
here is the basic function when creating new ticket (incoming message)
#api.model
def message_new(self, msg, custom_values=None):
""" Overrides mail_thread message_new that is called by the mailgateway
through message_process.
This override updates the document according to the email.
"""
# remove default author when going through the mail gateway. Indeed we
# do not want to explicitly set user_id to False; however we do not
# want the gateway user to be responsible if no other responsible is
# found.
create_context = dict(self.env.context or {})
create_context['default_user_id'] = False
defaults = {
'name': msg.get('subject') or _("No Subject"),
'email_from': msg.get('from'),
'email_cc': msg.get('cc'),
'partner_id': msg.get('author_id', False),
}
if custom_values:
defaults.update(custom_values)
res_id = super(ProjectIssue, self.with_context(create_context)).message_new(msg, custom_values=defaults)
issue = self.browse(res_id)
email_list = issue.email_split(msg)
partner_ids = filter(None, issue._find_partner_from_emails(email_list))
issue.message_subscribe(partner_ids)
return res_id
when I add
'description' : msg.get('body'),
I can get the body of the email, but its on text format,
then I check on 'description' and I found this
description = fields.text('Private Note')
that's why I only get text format, not HTML format,
so I change the description format to this
description = fields.Html('Private Note')
then the format of description is back to normal and readable.
Problem
i've to do a little html email just for test. The problem is that right now i cannot reset all the space between this 5 tds.
I need them in the center of the table.
Tries
I already tried, as suggested in many posts:
border spacing
border collapse
reset all in css ( html, body, p etc )
display: inline-table
display: inline-block
This is only the interested row of a bigger table, the other rows works perfectly.
i don't know what i could try to fix this.
Expectation
five square near to each other in the center of the
Code
<table id="bodyTable" width="100%" bgcolor="#efefef" border="0" cellspacing="0" cellpadding="0" style="margin: 0 auto; font-family: Museo, Helvetica, Arial, sans-serif">
<tr>
<td>
<table align="center" border="0" cellspacing="0" cellpadding="0" style="max-width: 600px">
<tr>
<tr>
<td>
<table width="600px" border="0" cellspacing="0" cellpadding="0" bgcolor="#efefef">
<tr>
<td align="center">
<img style="height: 30px; padding: 10px" src="https://i.ibb.co/y48sqQs/Goglueplus-Logo.png" alt="twitterButton">
</td>
<td align="center">
<img style="height: 30px; padding: 10px;" src="https://i.ibb.co/m5nZrrg/facebook-Mini-Button.png" alt="facebookButton">
</td>
<td align="center">
<img style="height: 30px; padding: 10px" src="https://i.ibb.co/cxLcQcQ/Instagram-Logo.png" alt="googlePlusButton">
</td>
<td align="center">
<img style="height: 30px; padding: 10px" src="https://i.ibb.co/rxT4vzx/Linkedin-Button.png" alt="linkedinButton">
</td>
<td align="center">
<img style="height: 30px; padding: 10px" src="https://i.ibb.co/3FCYZ4z/twitter-Button.png" alt="instagramButton">
</td>
</tr>
</table>
</td>
</tr>
</tr>
</table>
</td>
</tr>
</table>
CSS RESET
body {
margin: 0;
padding: 0;
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
-webkit-font-smoothing: antialiased !important;
}
img {
border: 0 none !important;
display: block;
height: auto;
line-height: 100%;
outline: none !important;
text-decoration: none;
}
a img {
border: 0 none;
}
table, td {
border-collapse: collapse;
border: 0 none;
}
td, a, span {
mso-line-height-rule: exactly;
}
p {
Margin: 0px !important;
Padding: 0px !important;
}
#bodyTable{
height: 100% !important;
margin: 0;
padding: 0;
width: 100% !important;
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
-webkit-font-smoothing: antialiased !important;
}
In the Html, your table width is 600px. Try 300px for centering them.
body {
margin: 0;
padding: 0;
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
-webkit-font-smoothing: antialiased !important;
}
img {
border: 0 none !important;
display: block;
height: auto;
line-height: 100%;
outline: none !important;
text-decoration: none;
}
a img {
border: 0 none;
}
table,
td {
border-collapse: collapse;
border: 0 none;
}
td,
a,
span {
mso-line-height-rule: exactly;
}
p {
Margin: 0px !important;
Padding: 0px !important;
}
#bodyTable {
height: 100% !important;
margin: 0;
padding: 0;
width: 100% !important;
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
-webkit-font-smoothing: antialiased !important;
}
<table id="bodyTable" width="100%" bgcolor="#efefef" border="0" cellspacing="0" cellpadding="0" style="margin: 0 auto; font-family: Museo, Helvetica, Arial, sans-serif">
<tr>
<td>
<table align="center" border="0" cellspacing="0" cellpadding="0" style="max-width: 600px">
<tr>
<tr>
<td>
<table width="300px" border="0" cellspacing="0" cellpadding="0" bgcolor="#efefef">
<tr>
<td align="center">
<img style="height: 30px; padding: 10px" src="https://i.ibb.co/y48sqQs/Goglueplus-Logo.png" alt="twitterButton">
</td>
<td align="center">
<img style="height: 30px; padding: 10px;" src="https://i.ibb.co/m5nZrrg/facebook-Mini-Button.png" alt="facebookButton">
</td>
<td align="center">
<img style="height: 30px; padding: 10px" src="https://i.ibb.co/cxLcQcQ/Instagram-Logo.png" alt="googlePlusButton">
</td>
<td align="center">
<img style="height: 30px; padding: 10px" src="https://i.ibb.co/rxT4vzx/Linkedin-Button.png" alt="linkedinButton">
</td>
<td align="center">
<img style="height: 30px; padding: 10px" src="https://i.ibb.co/3FCYZ4z/twitter-Button.png" alt="instagramButton">
</td>
</tr>
</table>
</td>
</tr>
</tr>
</table>
Need to check the specific cell value from a table in selenium.
As per the GUI view it is the 5th column of 1st Row and I need to keep reading the value of this cell until it changes to some other state from in progress state.Following is the XML:
<html>
<head><style>
BODY
{
font-family: Arial, Helvetica, sans-serif;
font-size: 8pt;
scrollbar-face-color: #666699;
scrollbar-3dlight-color: #c2c8e2;
scrollbar-shadow-color: #c2c8e2;
scrollbar-highlight-color: #666699;
scrollbar-darkshadow-color: #666699;
scrollbar-arrow-color: #e6eef7;
scrollbar-track-color: #e6eef7;
background-color: rgb(255, 255, 255);
}
TD
{
color: #000000;
font-size: 8pt;
}
</style></head>
<body topMargin="0" leftMargin="0" onload="javascript:OnLoad();" onunload="javascript:closeWin();"><div id="divMainTbl" style="width: 1358px; height: 182px; overflow: auto; position: relative;" marginheight="0" marginwidth="0" leftmargin="0" topmargin="0"><form name="frmDSV" id="frmDSV" style="margin-top: 0px; margin-bottom: 0px;" action="/epace/epace-cgi/pacecgi.exe?sessionid=" method="post" target="ifChildEvents"><table width="100%" id="tblQ" border="0" cellSpacing="0" cellPadding="0" nowrap="" xmlns:user="" xmlns:msxsl=""><tbody><tr style="background-color: rgb(241, 241, 241);">
<td noWrap="">
In Progress
</td>
</tr></tbody></table></form></div></body></html>
<DIV id="divMainTbl" style='position:
<TABLE id="tblQ" WIDTH="100%" BOR>
<TR>
-- Column <tds
</TR>
<tr style="background-color:#F1F1F1;">
<td class="HU2"> 1 </td>
<td nowrap width="2%" height="15" </td>
<td nowrap> Positions </td>
<td nowrap> Data Upload </td>
<td nowrap> Completed </td>
Looks like that's the only td you have. If so it's fairly easy.
//div[#id='divMainTbl']//td
Since the div has an id it easier to start from there and find the ONLY td accordingly.
I am trying to recreate something close to this table:
I am getting weird lines, though, with the way that I've gone about trying to do it. How do I get rid of them? Or could someone tell me the easiest way to achieve what is done in the table pictured above? Here is my code:
<!DOCTYPE html>
<html>
<head>
<title>Assignment #4</title>
<style>
table
{
font-family:"Courier New", Arial, Helvetica, sans-serif;
border-collapse:collapse;
margin: auto;
border-bottom-style: double; border-top-style: double;
}
table.border tr {border: 1px solid black; border-left: 0px solid;
border-right: 0px solid;}
th
{
font-size:18px;
font-style: bold;
padding-top:2px;
padding-bottom:2px;
background-color:lightblue;
color:#000000;
}
tr.white td
{
color:#000000;
background-color: #ffffff;
}
td,th
{
font-size:1em;
padding:3px 7px 2px 7px;
text-align: left;
</style>
</head>
<body>
<body>
<h3 style="text-align: center; font-family: courier new;">
<strong>Code-page support in microsoft windows</strong></h3>
<table class="border">
<tr>
<th>Code-Page ID</th>
<th style="border: 1px solid black; text-align: center;">Name</th>
<th colspan="2">ACP OEMCP</th>
</tr
<div>
<tr class="white">
<td style="background-color: lightblue;" rowspan="3">1200
<br/>1250
<br/>1251</td>
<td style="border: 1px solid black;" rowspan="3">Unicode
<br/>Windows 3.1 Eastern European
<br/>Windows 3.1 Cynillic</td>
<td rowspan="3"><br/>X <br/>X</td>
</tr>
<tr class="white">
<td style="border: 1px solid black;"></td>
</tr>
<tr class="white">
<td style="border: 1px solid black;"></td>
</tr>
</div>
<div>
<tr class="white">
<td style="background-color: lightblue;" rowspan="3">437 <br/>708 <br/>709</td>
<td style="border: 1px solid black;" rowspan="3">MS-DOS
<br/>Arabic (ASMO 708)
<br/>Arabic (ASMO 449)</td>
<td><br/></td>
<td colspan="2">X <br/>X <br/>X</td>
</tr>
<tr class="white">
<td style="border: 1px solid black;"></td>
</tr>
<tr class="white">
<td style="border: 1px solid black;"></td>
</tr>
</div>
<div>
<tr class="white">
<td style="background-color: lightblue;">Assignment#4</td>
<td style="border: 1px solid black;">
Mansfield University</td>
<td colspan="2"><center>
<img src="http://mansfield.edu/files/images/Facebook.gif"> </center></td>
</tr>
</div>
</table>
</body>
</html>
First of all the link of the image sample didn't work here for me :(
But if you mean the vertical lines like line1|line2 are your problem, you can use colspan=2. This will result in something like line1 line2.
Example:
<tr>
<td colspan=2>
</td>
<td>
</td>
</tr>
Hope that will help,
Regards,
Otacon
Your code is a mess! You put two "body" and forgot some "}" and ">".
Apart that the problem was the "td's" in blank that you put inside the "tr". Here you have the code:
<!DOCTYPE html>
<html>
<head>
<title>Assignment #4</title>
<style>
table {
font-family:"Courier New", Arial, Helvetica, sans-serif;
border-collapse:collapse;
margin: auto;
border-bottom-style: double; border-top-style: double;
}
table.border tr {
border: 1px solid black;
border-left: 0px solid;
border-right: 0px solid;
}
th{
font-size:18px;
font-style: bold;
padding-top:2px;
padding-bottom:2px;
background-color:lightblue;
color:#000000;
}
tr.white td {
color:#000000;
background-color: #ffffff;
}
td,th{
font-size:1em;
padding:3px 7px 2px 7px;
text-align: left;
}
</style>
</head>
<body>
<h3 style="text-align: center; font-family: courier new;">
<strong>Code-page support in microsoft windows</strong></h3>
<table class="border">
<tr>
<th>Code-Page ID</th>
<th style="border: 1px solid black; text-align: center;">Name</th>
<th colspan="2">ACP OEMCP</th>
</tr>
<tr class="white">
<td style="background-color: lightblue;" rowspan="3">1200
<br/>1250
<br/>1251</td>
<td style="border: 1px solid black;" rowspan="3">Unicode
<br/>Windows 3.1 Eastern European
<br/>Windows 3.1 Cynillic</td>
<td rowspan="3"><br/>X <br/>X</td>
</tr>
<tr class="white">
</tr>
<tr class="white">
</tr>
<tr class="white">
<td style="background-color: lightblue;" rowspan="3">437 <br/>708 <br/>709</td>
<td style="border: 1px solid black;" rowspan="3">MS-DOS
<br/>Arabic (ASMO 708)
<br/>Arabic (ASMO 449)</td>
<td><br/></td>
<td colspan="2">X <br/>X <br/>X</td>
</tr>
<tr class="white">
</tr>
<tr class="white">
</tr>
<tr class="white">
<td style="background-color: lightblue;">Assignment#4</td>
<td style="border: 1px solid black;">
Mansfield University</td>
<td colspan="2"><center>
<img src="http://mansfield.edu/files/images/Facebook.gif"> </center></td>
</tr>
</table>
</body>
</html>
I think that's what you're looking for.
Hope this answer helped you.
Regards,
LGhost