Я пытаюсь отправить электронное письмо из outlook (офис 365) в формате HTML. Тонкая линия появляется на мониторе с большим экраном (27 дюймов или более) или с уровнем увеличения 175%. В приведенном ниже коде не отображается горизонтальная линия со 100% -ным увеличением в Office 365, но если я увеличу масштаб (нажмите вкладку, Форматировать текст -> Увеличение) до (170% -200%), горизонтальная линия появится случайным образом ниже некоторой части заголовка ex; Заголовок информации -2, заголовок заголовка (изображение прилагается). 
Вот мой html, который я вставляю в почту Outlook.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Request Submitted</title>
<style type="text/css">
#outlook a {
padding: 0;
}
/* Force Outlook to provide a "view in browser" button. */
body {
width: 100% !important;
/*line-height: 100%;*/
}
.ReadMsgBody {
width: 100%;
}
.ExternalClass {
width: 100%;
}
/* Force Hotmail to display emails at full width */
body {
-webkit-text-size-adjust: none;
}
/* Prevent Webkit platforms from changing default text sizes. */
/* Reset Styles */
body {
margin: 0;
padding: 0;
}
img {
border: 0;
height: auto;
line-height: 100%;
outline: none;
text-decoration: none;
}
.ExternalClass * {
line-height: 100%;
}
body,
h1,
h2,
h3,
h4,
h5,
h6,
div,
table,
u,
td,
p {
margin: 0;
margin-bottom: 0;
padding: 0;
}
body {
padding: 0;
font-family: "Segoe UI Light", "Segoe UI", "Arial";
}
h1 {
font-size: 24px;
font-weight: normal;
margin: 10px 0px;
}
h2,
.h2 {
display: block;
padding: 5px 10px;
background-color: rgb(195, 203, 211);
color: rgb(52, 73, 94);
font-size: 16px;
}
h4 {
margin-left: 9px;
}
div.statusLabel {
display: block;
height: 20px;
padding: 10px;
background-color: rgb(195, 203, 211);
margin-bottom: 10px;
margin-right: 20px;
}
div.statusLabel.partialStatus {
height: 36px;
}
div.statusLabel p {
color: #FFFFFF;
font-size: 16px;
line-height: 16px;
text-align: center;
text-transform: uppercase;
}
div.statusLabel span {
display: none;
}
div.statusLabel.partialStatus span {
display: inline;
}
div.statusTile {
display: block;
width: 98px;
height: 98px;
padding: 10px;
background-color: rgb(195, 203, 211);
border: 1px solid rgb(183, 192, 202);
margin-bottom: 20px;
margin-left: 10px;
float: left;
}
div.statusTile.leftTile {
margin-left: 0px !important;
}
div.statusTile p {
position: relative;
top: 36px;
color: #FFFFFF;
font-size: 16px;
text-align: center;
}
div.statusTile span {
display: none;
}
div.statusTile.twoLine span {
display: block;
}
div.statusTile.twoLine p {
top: 24px;
}
/*Colors*/
.submitted {
background-color: #0078D7 !important;
}
.approved {
background-color: #107C10 !important;
}
.reserved {
background-color: #FFB900 !important;
}
.noRibbon {
border: 0 !important;
}
table table table {
margin-top: -10px !important;
}
</style>
</head>
<body style="font-family: " Segoe UI ", open-sans, Geneva, Verdana, sans-serif;font-weight:lighter;">
<table id="tblMain" cellpadding="0" cellspacing="0" height="100%" width="100%" border="0">
<tbody>
<tr>
<td align="center" valign="top">
<table cellpadding="0" cellspacing="0" width="800" border="0">
<tbody>
<tr>
<td>
<p style="font-size:16px;margin:0px"><b><i>Email Heading.</i></b> </p>
<h1>This is a Test Email.</h1>
</td>
</tr>
<tr>
<td>
<table>
<tbody>
<tr>
<td width="28%" valign="top" style="padding:10px 0px 20px 0px;">
<table width="90%" border="0" cellspacing="10" cellpadding="10">
<tbody>
<tr style="padding-top:10px;">
<td style="padding:10;background-color:#0078D7;">
<p style="color:#FFFFFF;font-size:15px;line-height:17px;margin:0px;text-align:center;text-transform:uppercase;">Title - 1</p>
</td>
</tr>
<tr>
<td style="padding:10;background-color:rgb(195,203,211);">
<p style="color:#FFFFFF;font-size:15px;line-height:17px;margin:0px;text-align:center;text-transform:uppercase;">Title - 2</p>
</tr>
<tr>
<td style="padding:10;background-color:rgb(195,203,211);">
<p style="color:#FFFFFF;font-size:15px;line-height:17px;margin:0px;text-align:center;text-transform:uppercase;">Title - 3</p>
</td>
</tr>
<tr>
<td style="padding:10;background-color:rgb(195,203,211);">
<p style="color:#FFFFFF;font-size:15px;line-height:17px;margin:0px;text-align:center;text-transform:uppercase;">Title - 4</p>
</td>
</tr>
<tr>
<td style="padding:10;background-color:rgb(195,203,211);">
<p style="color:#FFFFFF;font-size:15px;line-height:17px;margin:0px;text-align:center;text-transform:uppercase;">Title - 5</p>
</td>
</tr>
</tbody>
</table>
</td>
<td width="72%" valign="top" style="padding:10px 0px 20px 0px;">
<!--Intro Text-->
<p style="line-height:20px;">Hello User,
</p>
<br /> Please ignore this email.
</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="background-color:rgb(195,203,211);color:rgb(52,73,94);font-size:15px;padding:10px;"> <b style="color:rgb(52,73,94);">
Information - 1</b>
</td>
</tr>
<tr>
<td style="padding-top:10px; padding-bottom:20px;">
<table cellpadding="0" cellspacing="10" width="100%">
<tbody>
<tr>
<td width="50%"><b>Header 1</b>: <span></span> </td>
<td width="50%"><b>Header 2</b>: <span></span> </td>
</tr>
<tr>
<td width="50%"><b>Header 3</b>: <span></span> </td>
<td width="50%"><b>Header 4</b>: <span></span> </td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="padding:5px 10px;background-color:rgb(195,203,211);"> <b style="color:rgb(52,73,94);font-size:16px;">Information - 2</b> </td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
Я изменил заполнение td, строка исчезает для заполнения td 10px, но это не соответствует. Можете ли вы помочь мне, как я могу удалить горизонтальную линию для уровня масштабирования 180%? Эту проблему можно увидеть с монитором 27 дюймов или более.
Спасибо.