Avatar billede optur Novice
26. oktober 2016 - 13:54 Der er 11 kommentarer

HTML email signatur fejler i outlook 2013

Hej Jeg er ved at lave html email signatur, og det virker fint i thunderbird og på mac, men IKKE i outlook.

Har lavet det i tabeller og det er som om microshit ikke vil arbejde som alle andre og gør td højere end normalt. Er det fordi der er noget css som outlook ikke kan håndtere eller hvad? hvordan får jeg løst mit problem uden at lave det hele til et billede.

min kode:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<style>
table {
    font-family:Helvetica, sans-serif;
    font-size: 12px;
    line-height:12px;
    color:#fff;
    background-color:#2b2e30;
    padding:7px;
    padding-bottom:3px;
    border:0px;
    /* border-collapse: collapse; */
    margin:5px;
    cellspacing:0px;
    cellpadding:0px;
}
th {
    text-align:left;
}
td {
    vertical-align:top;
    height:14px;
}
.profil {
    margin-left:20px;
}
.logo {
    display: block;
    margin: auto;
    width:70%;
}
.orange-txt {
    color:#ec6608;
}
.headline {
    color:#fff;
    font-weight:bolder;
    font-size:14px;
}
.height {
    height:16px;
}
hr {
    background-color: #ec6608; height: 1px; border: 0;
}
</style>
<body>
<table>
<tr>
    <th colspan="2">Med venlig hilsen<br /><br /></th>
</tr>
  <tr>
    <td class="headline">Sten Frydenlund Jensen</td>
    <td rowspan="6"><img class="profil" src="http://faaopmaerksomhed.dk/var-img/sfj-profil.png" /></td>
  </tr>
  <tr>
    <td><span class="orange-txt"><i>Multimediedesigner AK</i></span></td>
  </tr>
  <tr>
    <td class="height"></td>
  </tr>
  <tr>
    <td>Telefon: <span class="orange-txt">2099 1955</span></td>
  </tr>
  <tr>
    <td>CVR: <span class="orange-txt">34489408</span></td>
  </tr>
  <tr>
    <td>Telefon: <span class="orange-txt">2099 1955</span></td>
  </tr>
  <tr>
    <td colspan="2"><hr /></td>
  </tr>
  <tr>
    <td colspan="2"><img class="logo" src="http://faaopmaerksomhed.dk/var-img/email-logo.png" /></td>
  </tr>
</table>
</body>
</html>
Avatar billede keysersoze Guru
26. oktober 2016 - 14:06 #1
Alt det der moderne kode kan du godt pakke væk - start med at skrive inline css og se om det gør en forskel.
Avatar billede optur Novice
26. oktober 2016 - 14:18 #2
Nu siger du moderne kode... Ved du hvilken html standard outlook 2013 benytter sig af for at vise signature?

Jeg har konverteret det hele om til inline style og det har intet ændret.

Min kode ser nu således ud:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>

<body>
<table style="font-family:Helvetica, sans-serif; font-size: 12px; line-height:12px; color:#fff; background-color:#2b2e30;    padding:7px; padding-bottom:3px; border:0px; /* border-collapse: collapse; */ margin:5px; cellspacing:0px; cellpadding:0px;">
<tr>
    <th style="text-align:left;" colspan="2">Med venlig hilsen<br /><br /></th>
</tr>
  <tr>
    <td style="color:#fff;    font-weight:bolder;    font-size:14px;">Sten Frydenlund Jensen</td>
    <td rowspan="6"><img style="margin-left:20px;" src="http://faaopmaerksomhed.dk/var-img/sfj-profil.png" /></td>
  </tr>
  <tr>
    <td><span style="color:#ec6608;"><i>Multimediedesigner AK</i></span></td>
  </tr>
  <tr>
    <td></td>
  </tr>
  <tr>
    <td>Telefon: <span style="color:#ec6608;">2099 1955</span></td>
  </tr>
  <tr>
    <td>CVR: <span style="color:#ec6608;">34489408</span></td>
  </tr>
  <tr>
    <td>Telefon: <span style="color:#ec6608;">2099 1955</span></td>
  </tr>
  <tr>
    <td colspan="2"><hr style="background-color: #ec6608; height: 1px; border: 0;" /></td>
  </tr>
  <tr>
    <td colspan="2"><img style="display: block; margin: auto; width:70%;" src="http://faaopmaerksomhed.dk/var-img/email-logo.png" /></td>
  </tr>
</table>
</body>
</html>
Avatar billede optur Novice
26. oktober 2016 - 15:19 #3
Problemet er linjeafstanden i outlook 2013, den vil ikke vise den rigtigt. Og jeg ved ikke hvilket version af html den acceptere og hvilke tags...
Avatar billede keysersoze Guru
26. oktober 2016 - 15:38 #4
Outlook benytter vist Word til at rendere markup - så tror ikke rigtig det er en standard og hvis så skal du langt tilbage. Prøv at sæt linjeafstand op på hver eneste td også - nedarvning af styles er ikke rigtig noget du skal satse på.
Avatar billede optur Novice
26. oktober 2016 - 15:39 #5
Problemet er at i outlook så er linjeafstanden i cellerne ALT for stor... det er der jeg har problemet... og en normal height virker ikke.
Avatar billede keysersoze Guru
26. oktober 2016 - 15:52 #6
ikke op som i større - men som i sæt stylen på hver td.
Avatar billede optur Novice
26. oktober 2016 - 15:57 #7
Yep så er jeg med. Er ved at teste nu...
Avatar billede optur Novice
26. oktober 2016 - 16:13 #8
Min email signatur i thunderbird, Mac mail:
http://forstenet.dk/dload/thunderbird.jpg

Min email signatur i outlook 2013 og 2016:
http://forstenet.dk/dload/outlook-2013-2016.jpg

Nu nuværende kode:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>

<body>
<table style="font-family:Helvetica, sans-serif; font-size: 12px; line-height:12px; color:#fff; background-color:#2b2e30;    padding:7px; padding-bottom:3px; border:0px; /* border-collapse: collapse; */ margin:5px; cellspacing:0px; cellpadding:0px;">
<tr>
    <th style="text-align:left;" colspan="2">Med venlig hilsen<br /><br /></th>
</tr>
  <tr>
    <td height="12" style="color:#ffffff; font-weight:bolder; line-height: 14px; font-size:14px;">Sten Frydenlund Jensen</td>
    <td rowspan="6"><img style="margin-left:20px;" src="http://faaopmaerksomhed.dk/var-img/sfj-profil.png" /></td>
  </tr>
  <tr>
    <td height="12" style="font-size: 12px; line-height: 12px;"><span style="color:#ec6608;"><i>Multimediedesigner AK</i></span></td>
  </tr>
  <tr>
    <td height="15" style="font-size: 15px; line-height: 15px;">&nbsp;</td>
  </tr>
  <tr>
    <td height="12" style="font-size: 12px; line-height: 12px;">Telefon: <span style="color:#ec6608;">2099 1955</span></td>
  </tr>
  <tr>
    <td height="12" style="font-size: 12px; line-height: 12px;">CVR: <span style="color:#ec6608;">34489408</span></td>
  </tr>
  <tr>
    <td height="12" style="font-size: 12px; line-height: 12px;">Telefon: <span style="color:#ec6608;">2099 1955</span></td>
  </tr>
  <tr>
    <td colspan="2"><hr style="background-color: #ec6608; height: 1px; border: 0;" /></td>
  </tr>
  <tr>
    <td colspan="2"><img style="display:block; margin: auto; width:70%;" src="http://faaopmaerksomhed.dk/var-img/email-logo.png" /></td>
  </tr>
</table>
</body>
</html>

Outlook VIL ikke acceptere min linjehøjde... hvad gør jeg forkert?
Avatar billede optur Novice
26. oktober 2016 - 16:20 #9
Jeg har forsøgt at bruge mso-line-height-rule: exactly; som nogle anbefaler, men resultatet er det samme, bare med et beskåret billede.
http://forstenet.dk/dload/outlook1.jpg
Avatar billede optur Novice
26. oktober 2016 - 16:26 #10
Er det fordi jeg ikke har omsluttet med et <p> tag?
Avatar billede keysersoze Guru
26. oktober 2016 - 18:41 #11
Jeg har desværre ikke mulighed for at teste her - men jeg kunne forestille mig at det er din padding og/eller margin på table der ødelægger det. Hvis du vil have sat padding på dine td'er så gør det i stylen på dine td'er.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester