html email - Lotus notes 8.5 image width and height -
i have image in it's own table separator. works fine 8 in 8.5 image, including featured image showing @ 50% width table.
lotus notes 8.0 -
lotus notes 8.5 -
notice in first, green separator image (which 1 big jpeg) correct width , height (as defined both style , width/height attributes).
whereas in 8.5, disregards these values , has pretty halved image size.
edit - code
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>document here</title> </head> <body> <center style="width: 100%; min-width: 580px;"><!-- header row --> <table class="container header" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: inherit; width: 580px; margin: 0 auto; padding: 0;"> <tbody> <tr align="left" style="vertical-align: top; text-align: left; padding: 0;"> <td align="center" class="center" style="word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; border-collapse: collapse !important; vertical-align: top; text-align: center; color: #222222; font-family: 'helvetica', 'arial', sans-serif; font-weight: normal; line-height: 19px; font-size: 14px; margin: 0; padding: 0;" valign="top"> <center style="width: 100%; min-width: 580px;"> <table class="row" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; display: block; padding: 0px;"><!-- logo & link --> <tbody> <tr align="left" style="vertical-align: top; text-align: left; padding: 0;"> <td align="left" class="wrapper last" style="word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; border-collapse: collapse !important; vertical-align: top; text-align: left; position: relative; color: #222222; font-family: 'helvetica', 'arial', sans-serif; font-weight: normal; line-height: 19px; font-size: 14px; margin: 0; padding: 0 0px 0px;" valign="top"> <table bgcolor="#110617" class="twelve columns bg-black" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 580px; color: #fff; background-color: #110617; margin: 0 auto; padding: 0;"> <tbody> <tr align="left" style="vertical-align: top; text-align: left; padding: 0;"> <td align="left" class="six sub-columns text-pad" style="vertical-align: middle; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; border-collapse: collapse !important; text-align: left; min-width: 0px; width: 50%; color: #fff; font-family: 'helvetica', 'arial', sans-serif; font-weight: normal; line-height: 19px; font-size: 13px; margin: 0; padding: 10px;" valign="middle"><a href="http://www.domain.com/?ref=mailshot" style="font-size: 12px; color: #fff; text-decoration: underline;">view in browser</a></td> <td align="right" class="six sub-columns" style="text-align: right; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; border-collapse: collapse !important; vertical-align: top; min-width: 0px; width: 50%; color: #fff; font-family: 'helvetica', 'arial', sans-serif; font-weight: normal; line-height: 19px; font-size: 13px; margin: 0; padding: 10px 10px 10px 0px;" valign="top">logo here</td> </tr> </tbody> </table> </td> </tr> <!-- / logo & link --><!-- separator --> <tr align="left" style="vertical-align: top; text-align: left; padding: 0;"> <td align="left" class="wrapper last" style="word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; border-collapse: collapse !important; vertical-align: top; text-align: left; position: relative; color: #222222; font-family: 'helvetica', 'arial', sans-serif; font-weight: normal; line-height: 19px; font-size: 14px; margin: 0; padding: 0 0px 0px;" valign="top"> <table bgcolor="#110617" class="twelve columns bg-black" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 580px; color: #fff; background-color: #110617; margin: 0 auto; padding: 0;"> <tbody> <tr align="left" style="vertical-align: top; text-align: left; padding: 0;"> <td align="left" class="twelve sub-columns last" style="word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; border-collapse: collapse !important; vertical-align: top; text-align: left; min-width: 0px; width: 100%; color: #fff; font-family: 'helvetica', 'arial', sans-serif; font-weight: normal; line-height: 19px; font-size: 13px; margin: 0; padding: 0px 0px 10px;" valign="top"><img align="none" alt="please load images best effect" height="55" src="http://i.imgur.com/lygyv5v.png" style="float: none; width: 580px; height: 55px; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; max-width: 100%; clear: both; display: block;" width="580" /></td> </tr> </tbody> </table> </td> </tr> <!--/ separator --><!-- post title --> <tr align="left" style="vertical-align: top; text-align: left; padding: 0;"> <td align="left" class="wrapper last" style="word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; border-collapse: collapse !important; vertical-align: top; text-align: left; position: relative; color: #222222; font-family: 'helvetica', 'arial', sans-serif; font-weight: normal; line-height: 19px; font-size: 14px; margin: 0; padding: 0 0px 0px;" valign="top"> <table bgcolor="#110617" class="twelve columns bg-black" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 580px; color: #fff; background-color: #110617; margin: 0 auto; padding: 0;"> <tbody> <tr align="left" style="vertical-align: top; text-align: left; padding: 0;"> <td align="left" class="twelve sub-columns text-pad last" style="word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; border-collapse: collapse !important; vertical-align: top; text-align: left; min-width: 0px; width: 100%; color: #fff; font-family: 'helvetica', 'arial', sans-serif; font-weight: normal; line-height: 19px; font-size: 13px; margin: 0; padding: 10px 0px 10px 10px;" valign="top"> <h1 align="left" class="lead" style="color: #fff; font-family: 'helvetica', 'arial', sans-serif; font-weight: bold; text-align: left; line-height: 25px; word-break: normal; font-size: 22px; margin: 0; padding: 0;">heading here</h1> </td> </tr> </tbody> </table> </td> </tr> <!-- / post title --> </tbody> </table> </center> </td> </tr> </tbody> </table> </center> </body> </html> here's js fiddle - http://jsfiddle.net/xaum0t9t/
do know why might be?
Comments
Post a Comment