Outlook signature with HTML in Exchange - html

I was asked to do a general signature in Outlook. After watching some tutorials, I wrote a code in HTML to put it in Exhange.
The problem is that in Outlook App the items next to the icons are not center, but if I execute the .html file It looks correct.
Does anybody know where I'm failing?
Here's my code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Logo Firma</title>
</head>
<body>
<table>
<tbody>
<tr>
<td style="border-right: 3px solid #007cc2;"><img style="padding-right: 10px; display: flex;" src="https://i.postimg.cc/26xJ0Pz7/logo.png"></td>
<td>
<table style="font-family: Arial, Helvetica, sans-serif; color: #111628; padding-left: 10px;">
<tbody>
<!--NOMBRE DE LA PERSONA-->
<tr><td style="font-size: 14px; font-weight: bold;">Full Name</td></tr>
<!--DEPARTAMENTO AL QUE PERTENECE-->
<tr><td style="font-size: 12px; font-weight: bold;">Area</td></tr>
<!--TELEFONO DE LA EMPRESA E INTERNO-->
<tr><td style="padding-top: 5px; display:flex; align-items: center; font-size: 12px;"><img style="float: left; padding-right: 10px; width: 20px; height: 20px" src="https://i.postimg.cc/zDSGNj8H/phone.png"> 22223344</td></tr>
<!--CELULAR-->
<tr><td style="padding-top: 5px; display:flex; align-items: center; font-size: 12px;"><img style="float: left; padding-right: 10px; width: 20px; height: 20px" src="https://i.postimg.cc/NMRf58XV/smartphone.png"> +123 94333222</td></tr>
<!--PAGINA WEB DE LA EMPRESA-->
<tr><td style="padding-top: 5px; display:flex; align-items: center; font-size: 12px;"><img style="float: left; padding-right: 10px; width: 20px; height: 20px" src="https://i.postimg.cc/vHYHZVZq/globe.png"> <a style="text-decoration: none; color: #111628;" href="www.akesse.com.uy/" target="_blank"> Pagina Web</a></td></tr>
<!--DIRECCION DE LA EMPRESA-->
<tr><td style="padding-top: 5px; display:flex; align-items: center; font-size: 12px;"><img style="float: left; padding-right: 10px; width: 20px; height: 20px" src="https://i.postimg.cc/ZncbLTVx/map-pin.png"> Somewhere<br>City, Country</td></tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
This is how it looks on Google Chrome
This is how it looks on Outlook App
I don't know what else to do, I've try modifying CSS styles but It did not result as I expected.


Outlook (desktop Windows?) doesn't support display:flex, or any changes to display. You have to use a td for the image, and another td for the text, and use padding and line-height to vertically center them.
So, untested:
<tr><td style="padding: 5px;"><img width="20" height="20" src="https://i.postimg.cc/ZncbLTVx/map-pin.png"></td><td style="padding: 5px; font-size: 12px;line-height:16px;"> Somewhere<br>City, Country</td></tr>
Note the use of width= and height=, needed for Outlook (it doesn't recognise style="width..." in the img tag).

Related

Position an image on top of 2 backgrounds on html email

I'm having a trouble to position an image on top og 2 different backgrounds on html email.
web view is fine but for emails it's not. I need this code to preforme on all email clients.
here is the layout of what it supposed to look like, and how it is actually look like.
layout
it seems that the image can't get the neative margin to go on top of the other background.
here is my code:
<!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" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title></title>
<style type="text/css">
body{
Margin: 0;
padding: 0;
min-width: 100%;
background-color: #F3F3F3;
}
table{
border-spacing: 0;
}
td{
padding: 0;
}
img{
border: 0;
}
#media screen and (min-width: 600px) {
}
#media screen and (max-width: 600px) {
}
</style>
<!--[if mso]>
<style>
body{
font-family: Helvetica, Arial, sans-serif!important;
text-align: center!important;
display: inline-block!important;
}
table{
border-collapse: collapse!important;
}
</style>
<![endif]-->
</head>
<body>
<div style="width: 100%; table-layout: fixed; background-color: #F3F3F3; padding-bottom: 20px; text-align: center;">
<table style="background-color: white; color: #2E4A63; margin: 0 auto; width: 100%; max-width: 600px; border-spacing: 0; padding-bottom: 20px;" width="100%" align="center">
<tr>
<td>
<table style="direction: ltr;" width="100%">
<tr>
<!-- Body Text -->
<td align="center" style="text-align: center;">
<h1 style="font-size: 30px; margin: 45px auto 20px auto; line-height: 32px;">
Highlight text
</h1>
<h3 style="font-size: 18px; font-weight: unset; line-height: 24px; text-align: center; margin: 0 auto 37px auto;">
Paragraph text
</h3>
</td>
</tr>
<tr>
<td align="center" style="text-align: center; padding-top: 10px; padding-bottom: 50px;">
<a href="#" tabindex="-1" target="_blank" style="padding: 15px 55px; background-color: #ff3f4e; color: white; text-decoration: none; font-size: 20px; font-weight: bold; text-align: center; border-radius: 50px;">
<span style="color: white;">Button</span>
</a>
</td>
</tr>
<!-- HERO 2 SECTION -->
<tr>
<td>
<table style="background-image: url('urlbackground.png'); background-size: cover; background-repeat: no-repeat; width: 600px; max-width: 100%;">
<tr>
<!-- TOP SECTION -->
<td>
<!-- Highlight text -->
<h1 style="font-size: 30px; font-weight: unset; margin: 45px auto 15px auto; line-height: 32px; color: black;">
some content
</h1>
<!-- Paragraph text -->
<h3 style="font-size: 18px; font-weight: unset; line-height: 24px; text-align: center; margin: 0;color: black;">
more content
</h3>
</td>
</tr>
<tr>
<td align="center" style="text-align: center; padding-top: 50px; padding-bottom: 90px;">
<a href="#" tabindex="-1" target="_blank" style="padding: 15px 60px; background-color: #16BBDF; color: white; text-decoration: none; font-size: 20px; font-weight: bold; text-align: center; border-radius: 50px;">
<span style="color: white;">Button 2</span>
</a>
</td>
</tr>
</table>
<table style="background-image: url('urlbackground2.png'); background-size: cover; background-repeat: no-repeat; width: 600px; height: 250px; max-width: 100%;">
<tr>
<td>
<div style="margin-top: 50px; margin-left: 40px; color: black; text-align: left; padding: 0; width: 40%;">
<h1 style="font-size: 25px; line-height: 1.2;">
Highlight
</h1>
<h3 style="font-size: 16px; font-weight: unset;">
some text
</h3>
</div>
</td>
<td>
<img src="image.png" alt="image" width="283" style="float: right; padding: 0;"/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</body>
</html>

How to position an element within a table cell?

I'm trying to move the "X" to the right, but whenever I change the padding in the style, the table is resized. What is the way to shift the "X" to the right side without messing with the table width?
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
.hash {
font-family: 'IBM Plex Sans', sans-serif;
font-size: 24px;
padding-top: 5px;
padding-left: 20px;
background-color: green;
overflow: hidden;
}
.keywords {
padding-left: 0px;
margin: 0;
font-size: 42px;
background: yellow;
}
</style>
<title>Untitled Document</title>
</head>
<div class="about">
<table width="580" cellpadding="0" cellspacing="2" class="intro">
<tr>
<td width="72" height="40" class="hash">X</td>
<td width="508" align="left" valign="middle" class="keywords">aaa / bbb / ccc</td>
</tr>
</table>
</div>
<body>
</body>
</html>

use text-indent. remove overflow:hidden and set max-width. also you can add text-indent to keywords. I created an example.
.hash {
font-family: 'IBM Plex Sans', sans-serif;
font-size: 24px;
padding-top: 5px;
padding-left: 20px;
background-color: green;
text-indent: 80px;
max-width: 60px;
}
.keywords {
padding-left: 0px;
margin: 0;
font-size: 42px;
background: yellow;
text-indent: 50px;
}
<div class="about">
<table width="580" cellpadding="0" cellspacing="2" class="intro">
<tr>
<td width="72" height="40" class="hash">X</td>
<td width="508" align="left" valign="middle" class="keywords">aaa / bbb / ccc</td>
</tr>
</table>
</div>

How do I create a table in the back of my other tables?

I'm new in coding HTML and CSS, I designed an email template in XD and code 95% of it but I can't figure out how to code the header and bring it to the back and overlay part of it with another white table.
Another question, how can I make the button smaller like the preview?
Here's the preview of the header of my design : https://imgur.com/zEcEeng
Here's what I code so far :
<!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>
<title>Financing Senior Housing Since 1992 | LTC Properties Inc.</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="x-apple-disable-message-reformatting" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style type="text/css">
/* Google font import Lato */
#import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght#400;700&display=swap');
/* Outlook link fix */
#outlook a {
padding: 0;
}
/* Hotmail background & line height fixes */
.ExternalClass {
width: 100% !important;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
/* Image borders & formatting */
img {
outline: none;
text-decoration: none;
-ms-interpolation-mode: bicubic;
}
a img {
border: none;
}
/* Re-style iPhone automatic links (eg. phone numbers) */
.appleLinksGrey a {
color: #575F65 !important;
text-decoration: none !important;
}
/* Hotmail symbol fix for mobile devices */
.ExternalClass img[class^=Emoji] {
width: 10px !important;
height: 10px !important;
display: inline !important;
}
/* Button hover colour change */
.CTA:hover {
background-color: #0162B2 !important;
}
#media screen and (max-width:640px) {
.mobilefullwidth {
width: 100% !important;
height: auto !important;
}
.logo {
padding-left: 30px !important;
padding-right: 30px !important;
}
.h1 {
font-size: 24px !important;
line-height: 30px !important;
padding-right: 30px !important;
padding-left: 30px !important;
padding-top: 20px !important;
}
.h2 {
font-size: 20px !important;
line-height: 0px !important;
padding-right: 30px !important;
padding-left: 30px !important;
}
.p {
font-size: 14px !important;
line-height: 20px !important;
padding-left: 30px !important;
padding-right: 30px !important;
padding-bottom: 0px !important;
}
.p-b {
font-size: 14px !important;
line-height: 20px !important;
padding-left: 20px !important;
padding-right: 0px !important;
padding-top: 10px !important;
}
.CTA_wrap {
padding-left: 30px !important;
padding-right: 30px !important;
padding-bottom: 0px !important;
}
.CTA_wrap2 {
padding-left: 30px !important;
padding-right: 30px !important;
padding-bottom: 25px !important;
}
.unsubscribe {
padding-left: 30px !important;
padding-right: 30px !important;
}
.us-img {
padding-left: 30px !important;
padding-right: 30px !important;
}
.footer {
font-size: 11px !important;
line-height: 16px !important;
padding-right: 30px !important;
padding-left: 30px !important;
}
}
</style>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body style="padding:0; margin:0; -webkit-text-size-adjust:none; -ms-text-size-adjust:100%; background-color:#EEEEEE; font-family: 'Open Sans', sans-serif; font-size:14px; line-height:20px; color:#575F65">
<!-- // FULL EMAIL -->
<table align="center" border="0" cellspacing="0" cellpadding="0">
<tr>
<!-- // LEFT SPACER CELL *** MUST HAVE A BACKGROUND COLOUR -->
<td bgcolor="#EEEEEE" style="font-size:0px">‌</td>
<!-- LEFT SPACER CELL // -->
<!-- // MAIN CONTENT CELL -->
<td align="center" width="600" bgcolor="#FFFFFF">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<!-- LOGO -->
<tr>
<td class="logo" align="center" bgcolor="#223663" style="padding-top: 30px;padding-bottom: 29px;">
<img src="https://www.dropbox.com/s/8060fh3df/123.png?raw=1" width="98" height="60" alt="TP logo">
</td>
</tr>
<!-- HERO CONTENT -->
<tr>
<td class="h1" align="left" bgcolor="#ffffff" style=" padding-left: 60px; padding-right: 60px; padding-top: 30px;padding-bottom: 0px; font-size:26px; line-height: 30px; font-weight: 700; color: #444A4E;">
Need Financing? We’ve got it.
</tr>
<tr>
<td class="p" align="left" bgcolor="#ffffff" style=" padding-left: 60px; padding-right: 60px; padding-top: 15px;padding-bottom: 15px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
Challenging times demand adaptive measures. While many capital providers are slowing or completely halting investments, LTC remains open for business. We're constantly thinking outside of the REIT box to provide creative financing solutions.<br/><br/>Of course, we continue to offer our core NNN and JV structures. </span><span style="font-style:normal;font-weight:bold;">But, did you know we also offer a variety of structured finance products?</span><span> These solutions provide a range of levers LTC can pull to help finance projects.
</tr>
<!-- CALL TO ACTION -->
<tr>
<td class="CTA_wrap" bgcolor="#FFFFFF" align="left" style="padding-top:15px; padding-bottom: 0px; padding-right: 60px; padding-left: 60px;">
<table border="0" cellspacing="0" cellpadding="0" align="left">
<!-- // BUTTON -->
<tr>
<td class="CTA" align="left" style="position: left; border-radius: 0px; padding-top: 15px; padding-right: 25px; padding-bottom: 15px; padding-left: 25px;" bgcolor="#0071CE">Contact Us!
</td>
</tr>
<!-- LINE -->
<tr>
<td align="center" bgcolor="#ffffff" style="padding-top: 30px;padding-bottom: 25px;">
<img src="https://www.dropbox.com/s/q4va5ixmmu3ako5/line-e.png?raw=1" width="480" height="1">
</td>
<!-- BENEFITS OF STRUCTURED FINANCE -->
<tr>
<table>
<tbody>
<tr>
<td align="left" bgcolor="#FFFFFF" style="padding-top: 0px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; font-size: 18px; line-height: 30px; font-weight: 700; text-align: left; color: #444A4E;">
<img align="left" src="https://www.dropbox.com/s/v3jmuxhagx0b509/title_shape_e.png?raw=1" width="18" height="31"> ‌BENEFITS OF STRUCTURED FINANCE:
</td>
</tr>
</tbody>
<table>
<tr>
<td class="p-b" align="left" bgcolor="#FFFFFF" style=" padding-left: 20px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
<span style="font-size: 11px;">◆</span> Provide liquidity through releasing “trapped” equity in properties<br>
<span style="font-size: 11px;">◆</span> Bridge maturing loans while waiting for the market to return<br> to normal<br>
<span style="font-size: 11px;">◆</span> Fund construction for shovel-ready projects<br>
<span style="font-size: 11px;">◆</span> Fund existing projects where other investors have backed away<br>
<span style="font-size: 11px;">◆</span> Provide an exit plan for equity investors who may have their own<br>
liquidity needs<br></span>
</tr>
<!-- LINE -->
<tr>
<td align="center" bgcolor="#ffffff" style="padding-top: 25px;padding-bottom: 20px;">
<img src="https://www.dropbox.com/s/q4va5ixmmu3ako5/line-e.png?raw=1" width="480" height="1">
</td>
<!-- PODUCTS INCLUDE -->
<tr>
<table>
<tbody>
<td align="left" bgcolor="#FFFFFF" style="padding-top: 0px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; font-size: 18px; line-height: 30px; font-weight: 700; text-align: left; color: #444A4E;">
<img align="left" src="https://www.dropbox.com/s/v3jmuxhagx0b509/title_shape_e.png?raw=1" width="18" height="31"> ‌PRODUCTS INCLUDE:
</td>
</tbody>
</tr>
<tr>
<td class="p-b" align="left" bgcolor="#FFFFFF" style=" padding-left: 20px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
<span style="font-size: 11px;">◆</span> Mezzanine            <span style="font-size: 11px;">◆</span> Preferred Equity<br>
<span style="font-size: 11px;">◆</span> Bridge              <span style="font-size: 11px;">◆</span> Construction Financing<br>
<span style="font-size: 11px;">◆</span> Unitranche Financing<br>
</tr>
<!-- LINE -->
<tr>
<td align="center" bgcolor="#ffffff" style="padding-top: 20px;padding-bottom: 20px;">
<img src="https://www.dropbox.com/s/q4va5ixmmu3ako5/line-e.png?raw=1" width="480" height="1">
</td>
<!-- DEAL PARAMETERS -->
<tr>
<table>
<tbody>
<td align="left" bgcolor="#FFFFFF" style="padding-top: 0px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; font-size: 18px; line-height: 30px; font-weight: 700; text-align: left; color: #444A4E;">
<img align="left" src="https://www.dropbox.com/s/v3jmuxhagx0b509/title_shape_e.png?raw=1" width="18" height="31"> ‌DEAL PARAMETERS:
</td>
</tbody>
</tr>
<tr>
<td class="p-b" align="left" bgcolor="#FFFFFF" style=" padding-left: 20px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
</span><span style="font-style:normal;font-weight:bold;">Transaction Size:</span><span><br>$1 million - $100 million<br><br>
</span><span style="font-style:normal;font-weight:bold;">Property Types:</span><span><br>Independent Living, Assisted Living, Memory Care, Skilled Nursing<br><br>
</span><span style="font-style:normal;font-weight:bold;">Locations:</span><span><br>Contiguous USA<br><br>
</span><span style="font-style:normal;font-weight:bold;">Financing Types:</span><span><br>NNN, JV, Mezzanine, Bridge, Construction, Unitranche, Preferred Equity<br><br>
</span><span style="font-style:normal;font-weight:bold;">Operators:</span><span><br>Regional, growth-oriented<br>
</tr>
<!-- LINE -->
<tr>
<td align="center" bgcolor="#ffffff" style="padding-top: 20px;padding-bottom: 20px;">
<img src="https://www.dropbox.com/s/q4va5ixmmu3ako5/line-e.png?raw=1" width="480" height="1">
</td>
<!-- ABOUT LTC -->
<tr>
<table>
<tbody>
<td align="left" bgcolor="#FFFFFF" style="padding-top: 0px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; font-size: 18px; line-height: 30px; font-weight: 700; text-align: left; color: #444A4E;">
<img align="left" src="https://www.dropbox.com/s/v3jmuxhagx0b509/title_shape_e.png?raw=1" width="18" height="31"> ‌ABOUT LTC:
</td>
</tbody>
</tr>
<tr>
<td class="p-b" align="center" bgcolor="#FFFFFF" style="align-items: center; padding-left: 20px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
</span><span style="font-style:normal;font-weight:bold;">180+ Investments | 27 States | 30 Operating Partners</span><span>
</tr>
<tr>
<td class=us-imga lign="center" bgcolor="#ffffff" style="padding-top: 0px;padding-bottom: 20px;">
<img src="https://wwcom/file.cfm/1/docs/map_home_033120.jpg" width="460" height="285">
</td>
<tr>
<td class="p-b" align="left" bgcolor="#FFFFFF" style=" padding-left: 0px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
Shared success is based on partnership and alignment. Our business is
about much more than real estate. It is about the operators who run
the communities and the residents who call our buildings home.<br>
<br>
We focus on building strong, long-term relationships and work to align
interests ensuring that all businesses are supported to create the best
outcomes for all.
</tr>
<!-- CALL TO ACTION -->
<tr>
<td class="CTA_wrap2" bgcolor="#FFFFFF" align="center" style="padding-top:20px; padding-bottom: 25px; padding-right: 0px; padding-left: 0px;">
<table border="0" cellspacing="0" cellpadding="0" align="center">
<!-- // BUTTON 2 -->
<tr>
<td class="CTA" align="center" style="position: center; border-radius: 0px; padding-top: 15px; padding-right: 25px; padding-bottom: 15px; padding-left: 25px;" bgcolor="#0071CE">Contact Us Today
</td>
</tr>
</tbody>
</table>
</td>
<!-- // RIGHT SPACER CELL *** MUST HAVE A BACKGROUND COLOUR -->
<td bgcolor="#ffffff" style="font-size:0px">‌</td>
<!-- RIGHT SPACER CELL // -->
</tr>
</table>
<tr>
<!-- // SOCIAL MEDIA -->
<td class="footer" align="center" bgcolor="#EEEEEE" style=" padding-top: 25px; padding-bottom: 20px; font-size: 12px; line-height: 18px; font-weight: 400; text-align: center; color: #575F65;">
<img src="https://www.dropbox.com/s/0k25a3lkki3pbip/linkedin_e.png?raw=1" width="19" height="18" style="padding-right: 8px" "padding-bottom: 10px"><a href="http://twitter.com" target="_blank"><img src="https://www.dropbox.com/s/1lnq77di7mue1zs/twitter_e.png?raw=1" width="22" height="18" style="padding-right: 8px"><a href="https://www.facebook.com/" target="_blank"><img src="https://www.dropbox.com/s/as39vdrbwtpvvp7/facebook_e.png?raw=1" width="18" height="18" style="padding-right: 7px"><a style=" padding-bottom: 20px" href="https://www.instagram.com" target="_blank"><img src="https://www.dropbox.com/s/c5clso0ov6qw97g/instagram_e.png?raw=1" width="18" height="18" style="padding-right: 7px"></a><br>
<!-- // FOOTER -->
© 2020 , Inc<br>
<a class="appleLinksGrey" style="color: #575F65; " href="https://www..com">www.website.com</a> | 1-8655<br>
e, CA 91361<br>
</td>
</tr>
<!-- FULL EMAIL // -->
</body>
</html>

I don't think it is possible to overlay different table rows over each other (someone correct me if i'm wrong) so I instead moved your top header containing the logo into a seperate div outside of the table and applied a negative margin to the table itself:
<div class="logo" align="center" style="background-color:#223663; padding-top:
30px;padding-bottom: 29px; height:125px;">
<a href="https://www.123.com" target="_blank"><img
src="https://www.dropbox.com/s/8060fh3df/123.png?raw=1" width="98" height="200" alt="TP
logo"> </a>
and
<table width="100%" style="margin-top:-50px" border="0" cellspacing="0"
cellpadding="0">
To make the button as small as the text and not the entire width you can set 'display: inline' to the element containing it:
<tr style="display:inline">
I wouldn't advise making this entire page as a table but if you have no choice but to stick to it, here is the full code:
<!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>
<title>Financing Senior Housing Since 1992 | LTC Properties Inc.</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="x-apple-disable-message-reformatting" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style type="text/css">
/* Google font import Lato */
#import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght#400;700&display=swap');
/* Outlook link fix */
#outlook a {
padding: 0;
}
/* Hotmail background & line height fixes */
.ExternalClass {
width: 100% !important;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
/* Image borders & formatting */
img {
outline: none;
text-decoration: none;
-ms-interpolation-mode: bicubic;
}
a img {
border: none;
}
/* Re-style iPhone automatic links (eg. phone numbers) */
.appleLinksGrey a {
color: #575F65 !important;
text-decoration: none !important;
}
/* Hotmail symbol fix for mobile devices */
.ExternalClass img[class^=Emoji] {
width: 10px !important;
height: 10px !important;
display: inline !important;
}
/* Button hover colour change */
.CTA:hover {
background-color: #0162B2 !important;
}
#media screen and (max-width:640px) {
.mobilefullwidth {
width: 100% !important;
height: auto !important;
}
.logo {
padding-left: 30px !important;
padding-right: 30px !important;
}
.h1 {
font-size: 24px !important;
line-height: 30px !important;
padding-right: 30px !important;
padding-left: 30px !important;
padding-top: 20px !important;
}
.h2 {
font-size: 20px !important;
line-height: 0px !important;
padding-right: 30px !important;
padding-left: 30px !important;
}
.p {
font-size: 14px !important;
line-height: 20px !important;
padding-left: 30px !important;
padding-right: 30px !important;
padding-bottom: 0px !important;
}
.p-b {
font-size: 14px !important;
line-height: 20px !important;
padding-left: 20px !important;
padding-right: 0px !important;
padding-top: 10px !important;
}
.CTA_wrap {
padding-left: 30px !important;
padding-right: 30px !important;
padding-bottom: 0px !important;
}
.CTA_wrap2 {
padding-left: 30px !important;
padding-right: 30px !important;
padding-bottom: 25px !important;
}
.unsubscribe {
padding-left: 30px !important;
padding-right: 30px !important;
}
.us-img {
padding-left: 30px !important;
padding-right: 30px !important;
}
.footer {
font-size: 11px !important;
line-height: 16px !important;
padding-right: 30px !important;
padding-left: 30px !important;
}
}
</style>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body style="padding:0; margin:0; -webkit-text-size-adjust:none; -ms-text-size-adjust:100%; background-color:#EEEEEE; font-family: 'Open Sans', sans-serif; font-size:14px; line-height:20px; color:#575F65">
<div class="logo" align="center" style="background-color:#223663; padding-top: 30px;padding-bottom: 29px; height:125px;">
<img src="https://www.dropbox.com/s/8060fh3df/123.png?raw=1" width="98" height="200" alt="TP logo">
</div>
<!-- // FULL EMAIL -->
<table align="center" border="0" cellspacing="0" cellpadding="0">
<tr>
<!-- // LEFT SPACER CELL *** MUST HAVE A BACKGROUND COLOUR -->
<td bgcolor="#EEEEEE" style="font-size:0px">‌</td>
<!-- LEFT SPACER CELL // -->
<!-- // MAIN CONTENT CELL -->
<td align="center" width="600" bgcolor="#FFFFFF">
<table width="100%" style="margin-top:-50px" border="0" cellspacing="0" cellpadding="0">
<tbody>
<!-- LOGO -->
<tr>
</tr>
<!-- HERO CONTENT -->
<tr>
<td class="h1" align="left" bgcolor="#ffffff" style=" padding-left: 60px; padding-right: 60px; padding-top: 30px;padding-bottom: 0px; font-size:26px; line-height: 30px; font-weight: 700; color: #444A4E;">
Need Financing? We’ve got it.
</tr>
<tr>
<td class="p" align="left" bgcolor="#ffffff" style=" padding-left: 60px; padding-right: 60px; padding-top: 15px;padding-bottom: 15px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
Challenging times demand adaptive measures. While many capital providers are slowing or completely halting investments, LTC remains open for business. We're constantly thinking outside of the REIT box to provide creative financing solutions.<br/><br/>Of course, we continue to offer our core NNN and JV structures. </span><span style="font-style:normal;font-weight:bold;">But, did you know we also offer a variety of structured finance products?</span><span> These solutions provide a range of levers LTC can pull to help finance projects.
</tr>
<!-- CALL TO ACTION -->
<tr>
<td class="CTA_wrap" bgcolor="#FFFFFF" align="left" style="padding-top:15px; padding-bottom: 0px; padding-right: 60px; padding-left: 60px;">
<table border="0" cellspacing="0" cellpadding="0" align="left">
<!-- // BUTTON -->
<tr style="display:inline">
<td class="CTA" align="left" style="position: left; border-radius: 0px; padding-top: 15px; padding-right: 25px; padding-bottom: 15px; padding-left: 25px;" bgcolor="#0071CE">Contact Us!
</td>
</tr>
<!-- LINE -->
<tr>
<td align="center" bgcolor="#ffffff" style="padding-top: 30px;padding-bottom: 25px;">
<img src="https://www.dropbox.com/s/q4va5ixmmu3ako5/line-e.png?raw=1" width="480" height="1">
</td>
<!-- BENEFITS OF STRUCTURED FINANCE -->
<tr>
<table>
<tbody>
<tr>
<td align="left" bgcolor="#FFFFFF" style="padding-top: 0px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; font-size: 18px; line-height: 30px; font-weight: 700; text-align: left; color: #444A4E;">
<img align="left" src="https://www.dropbox.com/s/v3jmuxhagx0b509/title_shape_e.png?raw=1" width="18" height="31"> ‌BENEFITS OF STRUCTURED FINANCE:
</td>
</tr>
</tbody>
<table>
<tr>
<td class="p-b" align="left" bgcolor="#FFFFFF" style=" padding-left: 20px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
<span style="font-size: 11px;">◆</span> Provide liquidity through releasing “trapped” equity in properties<br>
<span style="font-size: 11px;">◆</span> Bridge maturing loans while waiting for the market to return<br> to normal<br>
<span style="font-size: 11px;">◆</span> Fund construction for shovel-ready projects<br>
<span style="font-size: 11px;">◆</span> Fund existing projects where other investors have backed away<br>
<span style="font-size: 11px;">◆</span> Provide an exit plan for equity investors who may have their own<br>
liquidity needs<br></span>
</tr>
<!-- LINE -->
<tr>
<td align="center" bgcolor="#ffffff" style="padding-top: 25px;padding-bottom: 20px;">
<img src="https://www.dropbox.com/s/q4va5ixmmu3ako5/line-e.png?raw=1" width="480" height="1">
</td>
<!-- PODUCTS INCLUDE -->
<tr>
<table>
<tbody>
<td align="left" bgcolor="#FFFFFF" style="padding-top: 0px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; font-size: 18px; line-height: 30px; font-weight: 700; text-align: left; color: #444A4E;">
<img align="left" src="https://www.dropbox.com/s/v3jmuxhagx0b509/title_shape_e.png?raw=1" width="18" height="31"> ‌PRODUCTS INCLUDE:
</td>
</tbody>
</tr>
<tr>
<td class="p-b" align="left" bgcolor="#FFFFFF" style=" padding-left: 20px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
<span style="font-size: 11px;">◆</span> Mezzanine            <span style="font-size: 11px;">◆</span> Preferred Equity<br>
<span style="font-size: 11px;">◆</span> Bridge              <span style="font-size: 11px;">◆</span> Construction Financing<br>
<span style="font-size: 11px;">◆</span> Unitranche Financing<br>
</tr>
<!-- LINE -->
<tr>
<td align="center" bgcolor="#ffffff" style="padding-top: 20px;padding-bottom: 20px;">
<img src="https://www.dropbox.com/s/q4va5ixmmu3ako5/line-e.png?raw=1" width="480" height="1">
</td>
<!-- DEAL PARAMETERS -->
<tr>
<table>
<tbody>
<td align="left" bgcolor="#FFFFFF" style="padding-top: 0px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; font-size: 18px; line-height: 30px; font-weight: 700; text-align: left; color: #444A4E;">
<img align="left" src="https://www.dropbox.com/s/v3jmuxhagx0b509/title_shape_e.png?raw=1" width="18" height="31"> ‌DEAL PARAMETERS:
</td>
</tbody>
</tr>
<tr>
<td class="p-b" align="left" bgcolor="#FFFFFF" style=" padding-left: 20px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
</span><span style="font-style:normal;font-weight:bold;">Transaction Size:</span><span><br>$1 million - $100 million<br><br>
</span><span style="font-style:normal;font-weight:bold;">Property Types:</span><span><br>Independent Living, Assisted Living, Memory Care, Skilled Nursing<br><br>
</span><span style="font-style:normal;font-weight:bold;">Locations:</span><span><br>Contiguous USA<br><br>
</span><span style="font-style:normal;font-weight:bold;">Financing Types:</span><span><br>NNN, JV, Mezzanine, Bridge, Construction, Unitranche, Preferred Equity<br><br>
</span><span style="font-style:normal;font-weight:bold;">Operators:</span><span><br>Regional, growth-oriented<br>
</tr>
<!-- LINE -->
<tr>
<td align="center" bgcolor="#ffffff" style="padding-top: 20px;padding-bottom: 20px;">
<img src="https://www.dropbox.com/s/q4va5ixmmu3ako5/line-e.png?raw=1" width="480" height="1">
</td>
<!-- ABOUT LTC -->
<tr>
<table>
<tbody>
<td align="left" bgcolor="#FFFFFF" style="padding-top: 0px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; font-size: 18px; line-height: 30px; font-weight: 700; text-align: left; color: #444A4E;">
<img align="left" src="https://www.dropbox.com/s/v3jmuxhagx0b509/title_shape_e.png?raw=1" width="18" height="31"> ‌ABOUT LTC:
</td>
</tbody>
</tr>
<tr>
<td class="p-b" align="center" bgcolor="#FFFFFF" style="align-items: center; padding-left: 20px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
</span><span style="font-style:normal;font-weight:bold;">180+ Investments | 27 States | 30 Operating Partners</span><span>
</tr>
<tr>
<td class=us-imga lign="center" bgcolor="#ffffff" style="padding-top: 0px;padding-bottom: 20px;">
<img src="https://wwcom/file.cfm/1/docs/map_home_033120.jpg" width="460" height="285">
</td>
<tr>
<td class="p-b" align="left" bgcolor="#FFFFFF" style=" padding-left: 0px; padding-right: 0px; padding-top: 0px;padding-bottom: 5px; font-size:14px; line-height: 20px; font-weight: 400; color: #575F65;">
Shared success is based on partnership and alignment. Our business is
about much more than real estate. It is about the operators who run
the communities and the residents who call our buildings home.<br>
<br>
We focus on building strong, long-term relationships and work to align
interests ensuring that all businesses are supported to create the best
outcomes for all.
</tr>
<!-- CALL TO ACTION -->
<tr>
<td class="CTA_wrap2" bgcolor="#FFFFFF" align="center" style="padding-top:20px; padding-bottom: 25px; padding-right: 0px; padding-left: 0px;">
<table border="0" cellspacing="0" cellpadding="0" align="center">
<!-- // BUTTON 2 -->
<tr>
<td class="CTA" align="center" style="position: center; border-radius: 0px; padding-top: 15px; padding-right: 25px; padding-bottom: 15px; padding-left: 25px;" bgcolor="#0071CE">Contact Us Today
</td>
</tr>
</tbody>
</table>
</td>
<!-- // RIGHT SPACER CELL *** MUST HAVE A BACKGROUND COLOUR -->
<td bgcolor="#ffffff" style="font-size:0px">‌</td>
<!-- RIGHT SPACER CELL // -->
</tr>
</table>
<tr>
<!-- // SOCIAL MEDIA -->
<td class="footer" align="center" bgcolor="#EEEEEE" style=" padding-top: 25px; padding-bottom: 20px; font-size: 12px; line-height: 18px; font-weight: 400; text-align: center; color: #575F65;">
<img src="https://www.dropbox.com/s/0k25a3lkki3pbip/linkedin_e.png?raw=1" width="19" height="18" style="padding-right: 8px" "padding-bottom: 10px"><a href="http://twitter.com" target="_blank"><img src="https://www.dropbox.com/s/1lnq77di7mue1zs/twitter_e.png?raw=1" width="22" height="18" style="padding-right: 8px"><a href="https://www.facebook.com/" target="_blank"><img src="https://www.dropbox.com/s/as39vdrbwtpvvp7/facebook_e.png?raw=1" width="18" height="18" style="padding-right: 7px"><a style=" padding-bottom: 20px" href="https://www.instagram.com" target="_blank"><img src="https://www.dropbox.com/s/c5clso0ov6qw97g/instagram_e.png?raw=1" width="18" height="18" style="padding-right: 7px"></a><br>
<!-- // FOOTER -->
© 2020 , Inc<br>
<a class="appleLinksGrey" style="color: #575F65; " href="https://www..com">www.website.com</a> | 1-8655<br>
e, CA 91361<br>
</td>
</tr>
<!-- FULL EMAIL // -->
</body>
</html>

Empty HTML mails in outlook.com, microsoft exchange & hotmail.com

I have to style an email and when I was done and tested it all seemed to work fine, except in outlook.com, Microsoft exchange and Hotmail. For some reason exchange strips all code used (tables, tr & td tags) whatever I do, is there some workaround or is it just not possible? I have used CSS in my <style> tag. Should I change that to inline styling? or is there some other use.
Also my mail uses certain values (shortcodes) which are being given by the form, this works all fine in all other mail boxes but again not in outlook. If I can't use code there is there some workaround for that too?
So long story short, how can I use code in my html-email if Microsoft exchange breaks all code and gives a blank mail.
The entire mail you can see here on my test site
Here is my mail code:
<style>
td {
text-decoration: none;
color: #78797a;
width: 420px;
line-height: 22px;
border: 1px solid black;
}
img {
display:block;
}
h3 {
text-decoration: none;
color: #434343;
}
h4 {
text-decoration: none;
color: #434343;
}
-webkit-text-size-adjust: none;
</style>
<table style="font-size: 15px; font-family: 'Open Sans', sans-serif; font-weight: 200;">
<img src="http://www.belife.nl/wp-content/uploads/2015/06/belife-RGB.jpg" align="top"><br>
<h4>Verwijzend arts</h4>
<tr style="padding: 10px">
<td> Naam</td><td> [naam_vw]</td>
</tr>
<tr style="padding: 10px">
<td> Voorletters</td> <td>[voorletters_vw]</td>
</tr>
<tr style="padding: 10px">
<td> Geslacht</td> <td>[geslacht_vw]</td>
</tr>
<tr style="padding: 10px">
<td> Functie verwijzer:</td> <td>[verwijzer_vw]</td>
</tr>
<tr style="padding: 10px">
<td> Naam instantie:</td> <td>[instantie_vw]</td>
</tr>
<tr style="padding: 10px">
<td>Adres:</td> <td>[adres_vw]</td>
</tr>
<tr style="padding: 10px">
<td>Postcode:</td> <td>[postcode_vw]</td>
</tr>
<tr style="padding: 10px">
<td>AGB code verwijzer:</td> <td>[agb_vw]</td>
</tr>
<tr style="padding: 10px">
<td>Mobiel verwijzer:</td> <td>[mobiel_vw]</td>
</tr>
<tr style="padding: 10px">
<td>E-mail:</td> <td>[email_vw]</td>
</tr>
</table>
Shortcodes such as [email_vw] are the ones that are being given via the form which need to be in there.
Any tips and answers are appreciated thanks in advance!
EDIT * I was able to fix outlook myself but now Hotmail is for some reason empty and shows just plain code, would this be caused by the code being inline? *

Well after some searching and reading #tvgemert's article link I was able to fix outlook.
<!DOCTYPE html>
<html>
<head></head>
<body>
<table style="font-size: 15px; font-family: 'Open Sans', sans-serif; font-weight: 200;">
<img src="http://www.belife.nl/wp-content/uploads/2015/06/belife-RGB.jpg" align="top" style="display: block;"><br><h3 style="text-decoration: none; color: #434343;">Met deze brief verwijs ik onderstaande client naar u voor een programma medische specialistische revalidatiezorg (MSR) bij BeLife.</h3>
<h4 style="text-decoration: none; color: #434343;">Verwijzend arts</h4>
<tr style="padding: 10px;">
<td style="text-decoration: none; color: #78797a; width: 420px; line-height: 22px; border: 1px solid black;"> Naam</td>
<td style="text-decoration: none; color: #78797a; width: 420px; line-height: 22px; border: 1px solid black;"> [naam_vw]</td>
</tr>
<tr style="padding: 10px;">
<td style="text-decoration: none; color: #78797a; width: 420px; line-height: 22px; border: 1px solid black;"> Voorletters</td> <td style="text-decoration: none; color: #78797a; width: 420px; line-height: 22px; border: 1px solid black;">[voorletters_vw]</td>
</tr>
<tr style="padding: 10px;">
<td style="text-decoration: none; color: #78797a; width: 420px; line-height: 22px; border: 1px solid black;"> Geslacht</td> <td style="text-decoration: none; color: #78797a; width: 420px; line-height: 22px; border: 1px solid black;">[geslacht_vw]</td>
</tr>
</table>
This has fixed outlook at the least by adding inline code the email is now no longer blank.

HTML Link Behaviour (Breaks div element)

Receiving odd behaviour of a link in xslt that breaks the page.
I am using XSLT to transform an XML list of manuals. I have included a link to open the manual, (as .pdf) with a target="_blank"
In Internet Explorer 8, (Yes, we are still having to use this), the link functions normally, opening the pdf in a new window, but the page the link was one gets shifted down about 1300-1500px. Refreshing the page fixes it, and it seems in testing that opening the same link a second time and future times it does not exibit this behaviour.
It does not shift the header or menu containers, only the body container.
I have used the developer tools to get the html it is using and do not see where or why it would be doing this. EDIT: I see at the bottom of the html output the css and it appears to have some extreme values for positions maybe?
Relevant (HTML) code:
<!-- saved from url=(0071)http://www.example.com/unit/admin/instructions/instructions.xml -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!-- Generated by Developer Tools. This might not be an accurate representation of the original source file -->
<HTML>
<HEAD>
<TITLE>Intranet</TITLE>
<META content="text/html; charset=UTF-16" http-equiv=Content-Type>
<SCRIPT type=text/javascript src="../../../scripts/jquery-1.11.1.min.js"></SCRIPT>
<LINK rel=stylesheet type=text/css href="../../../css/tacamo.css">
</HEAD>
<BODY style="ZOOM: 1">
<DIV style="MARGIN: auto" id=wing-page-container>
<DIV id=header-container><IMG alt="" align=middle src="../images/elements/header.png" width=1000></DIV>
<DIV id=nav-container>
<DIV id=menu>
<UL>
<LI><A id=menu href="http://www.example.com/unit/admin/admin.html">BACK</A></LI>
</UL>
</DIV>
</DIV>
<DIV id=instructions-content-container>
<TABLE class=instructions align=center>
<TBODY>
<TR>
<TH style="TEXT-ALIGN: center; WIDTH: 75px">Instruction Number</TH>
<TH style="TEXT-ALIGN: center; WIDTH: 75px">Date</TH>
<TH style="TEXT-ALIGN: center; WIDTH: 25px">COG</TH>
<TH style="WIDTH: 500px">Description</TH>
<TH style="TEXT-ALIGN: center; WIDTH: 50px">Open</TH>
</TR>
<TR style="BACKGROUND-COLOR: #c0d0e0">
<TD style="WIDTH: 75px">1</TD>
<TD style="TEXT-ALIGN: center; WIDTH: 75px">09/24/1997</TD>
<TD style="TEXT-ALIGN: center; WIDTH: 25px">GEORGE</TD>
<TD style="WIDTH: 500px">MANUAL ABOUT 1 THING</TD>
<TD style="TEXT-ALIGN: center; WIDTH: 25px"><A href="http://www.example.com/unit/admin/instructions/1-thing.pdf" target=_blank><IMG border=0 src="../images/elements/pdf-logo.gif" width=25 height=25></A></TD>
</TR>
<TR style="BACKGROUND-COLOR: #ffffff">
<TD style="WIDTH: 75px">2</TD>
<TD style="TEXT-ALIGN: center; WIDTH: 75px">03/26/2010</TD>
<TD style="TEXT-ALIGN: center; WIDTH: 25px">GEORGE</TD>
<TD style="WIDTH: 500px">MANUAL ABOUT 3 THING</TD>
<TD style="TEXT-ALIGN: center; WIDTH: 25px"><A href="http://www.example.com/unit/admin/instructions/2-thing.pdf" target=_blank><IMG border=0 src="../images/elements/pdf-logo.gif" width=25 height=25></A></TD>
</TR>
<TR style="BACKGROUND-COLOR: #c0d0e0">
<TD style="WIDTH: 75px">3</TD>
<TD style="TEXT-ALIGN: center; WIDTH: 75px">04/10/2014</TD>
<TD style="TEXT-ALIGN: center; WIDTH: 25px">GEORGE</TD>
<TD style="WIDTH: 500px">MANUAL ABOUT 3 THING</TD>
<TD style="TEXT-ALIGN: center; WIDTH: 25px"><A href="http://www.example.com/unit/admin/instructions/3-thing.pdf" target=_blank><IMG border=0 src="../images/elements/pdf-logo.gif" width=25 height=25></A></TD>
</TR>
</TBODY>
</TABLE>
</DIV>
<DIV id=footer-container>
<P class=footer>Admin POC: Admin ITPOC's (555-1212)</P>
</DIV>
</DIV>
<DIV style="BORDER-BOTTOM: #ff99cc 1px solid; TEXT-ALIGN: left; FILTER: progid:DXImageTransform.Microsoft.Alpha(opacity=80); BORDER-LEFT: #ff99cc 1px solid; PADDING-BOTTOM: 1px; LINE-HEIGHT: 100%; BACKGROUND-COLOR: #ffcccc; MARGIN: 0px; PADDING-LEFT: 1px; PADDING-RIGHT: 1px; DISPLAY: block; FONT-FAMILY: 'Sans Serif',serif; FLOAT: left; VISIBILITY: visible; COLOR: black; FONT-SIZE: 11pt; OVERFLOW: visible; BORDER-TOP: #ff99cc 1px solid; BORDER-RIGHT: #ff99cc 1px solid; PADDING-TOP: 1px; font-decoration: none" class=IEDevToolbarAddedElement>href=http://www.example.com/unit/admin/instructions/1-thing.pdf</DIV>
</DIV>
<DIV style="Z-INDEX: 459008; BORDER-BOTTOM: 0px; POSITION: absolute; BORDER-LEFT: 0px; PADDING-BOTTOM: 0px; LINE-HEIGHT: 0; MARGIN: 0px; PADDING-LEFT: 0px; WIDTH: 25px; PADDING-RIGHT: 0px; DISPLAY: block; HEIGHT: 25px; VISIBILITY: visible; OVERFLOW: hidden; BORDER-TOP: 0px; TOP: 5808px; BORDER-RIGHT: 0px; PADDING-TOP: 0px; LEFT: 1346px" class=IEDevToolbarAddedElement>
<DIV style="BORDER-BOTTOM: #ff99cc 1px solid; TEXT-ALIGN: left; FILTER: progid:DXImageTransform.Microsoft.Alpha(opacity=80); BORDER-LEFT: #ff99cc 1px solid; PADDING-BOTTOM: 1px; LINE-HEIGHT: 100%; BACKGROUND-COLOR: #ffcccc; MARGIN: 0px; PADDING-LEFT: 1px; PADDING-RIGHT: 1px; DISPLAY: block; FONT-FAMILY: 'Sans Serif',serif; FLOAT: left; VISIBILITY: visible; COLOR: black; FONT-SIZE: 11pt; OVERFLOW: visible; BORDER-TOP: #ff99cc 1px solid; BORDER-RIGHT: #ff99cc 1px solid; PADDING-TOP: 1px; font-decoration: none" class=IEDevToolbarAddedElement>href=http://www.example.com/unit/admin/instructions/3-thing.pdf</DIV>
</DIV>
</BODY>
</HTML>