Avatar billede askalot Mester
21. oktober 2013 - 15:25 Der er 7 kommentarer

HTML Mail - img's wrapped i <a> tag laver problemer

Hej jeg har lavet en helt simpel HTML mail (sliced fra photoshop)

Problemer er at når jeg vælger et af de slicede billeder i dreamweaver, og tildeler billedet et link (wrapper i <a> tag)..så ser det pludselig forkert ud - Hvidt luft omkring billede med link.

Det åndsvage er at det visuelle problem ses kun når mailen ses i Outlook

Nogle tips?
Avatar billede askalot Mester
21. oktober 2013 - 15:26 #1
Og ja har tildelt border="0" på img tag'et , og har prøvet at valign="top" på alle celler.
Avatar billede nyhuus Nybegynder
21. oktober 2013 - 15:29 #2
Hvordan ser HTML koden ud rundt om billedet?
Laver den evt noget styling på a tagget, eller på img tagget?
Avatar billede askalot Mester
21. oktober 2013 - 15:41 #3
<table  cellpadding="0" cellspacing="0" border="0" align="center" id="Table_01" width="680" height="680" border="0" cellpadding="0" cellspacing="0">
    <tr valign="top"><td valign="top"><img src="images/index_01.jpg" width="680" height="462" alt=""></td></tr>
    <tr valign="top"><td valign="top"><a href="mailto:some@mail.com"><img style="display:inline; float:left;" src="images/index_02.png" alt="" width="680" height="19" border="0" align="top"></a></td>
    </tr><tr valign="top"><td valign="top"><img src="images/index_03.jpg" width="680" height="199" alt=""></td></tr></table>

 
Det er den celle med "images/index_02.png" der giver probs

Du kan se jeg forgæves har forsøgt med noget display:inline, og float left;
Avatar billede askalot Mester
21. oktober 2013 - 15:42 #4
Går ikke udfra det har noget med doctype at gøre..da de fleste email klienter alligvel stripper den del.
Avatar billede vandrefuglen Juniormester
31. oktober 2013 - 15:00 #5
Prøv med flg css:

a > img {border:none;}
Avatar billede Stickano Nybegynder
13. november 2013 - 16:40 #6
Du skal sætte en border:none; på din <a> tag.

f.eks.

<script type="text/css">

a.imglink:active, a.imglink:hover, a.imglink:link, a.imglink:visited{
border:none;
}

</script>


<a href="mailto:some@mail.com" class="imglink"><img style="display:inline; float:left;" src="images/index_02.png" alt="" width="680" height="19" border="0" align="top"></a>


Der er lavet lidt CSS, og den CSS class bliver kaldt i dit <a> tag.
Avatar billede askalot Mester
22. januar 2014 - 22:35 #7
Det hjalp detsvære ikke på mit problem.. lukker med mindre end anden har lyst til point
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
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

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