Mail handtekening

Status
Niet open voor verdere reacties.
C

Crumpler512

Gebruiker
Lid geworden
25 nov 2015
Berichten
22
Hallo

Ik heb in Dreamwaver een Mail handtekening gemaakt. Op computer (Apple mail - Mac) ziet deze er prima uit. Alleen op iPhone en iPad is er geen verschil tussen de kleine en grote fonts. Ik heb de line-height overal verwijderd omdat deze er eerst voor zorgde dat de fonts overlapte. Is dit het probleem? Moet deze terug?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>[Handtekening MRG</title>
</head>
<body>


<table cellpadding="0" cellspacing="0" border="0" style="font-size:12px; font-family: Arial; width="408">
<tr>
<td colspan="2" style="color: #000000; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #977e6b" height="25"><strong>Marijn Geerts</strong><br></td>
</tr>

<tr>
<td align="left"><a href="www.mrglichtgeluid.com"><img src="http://i64.tinypic.com/16gy78z.jpg" width="250"/></a></td>
</tr>
<tr>
<td width="427" style="font-size:8px; font-family:Verdana; color:#696969; padding-top: 1px; border-top-width: 1px; border-top-style: solid; border-top-color: #c1ab8b" colspan="2"><span style="font-size:10px;">info@MRGlichtgeluid.be &nbsp;• +32 494 11 61 69 • Straat 70, 2870 Puurs (BE)</span><br>
<br>
<br></td>
</tr>
<td width="427" style="font-size:8px; font-family:Verdana; color:#000000; padding-top: 10px; padding-bottom: 10px;" colspan="3"><h5>BTW BE0643.720.506 - IBAN: BE83 7506 7149 7315 -BIC: AXAB BE 22<br>
</h5>
</table>



</body>
</html>
Klik om te vergroten...
 
Nee. Heeft niets met de line height ye maken.

Kijk eens wat hij doet als je het eerste deel weghaalt.

Alles voor <table> weghalen
En onderin de 2 regels na </table>
 
Als dat niet werkt kun je dit:
<table cellpadding="0" cellspacing="0" border="0" style="font-size:12px; font-family: Arial; width="408">
<tr>
<td colspan="2" style="color: #000000; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #977e6b" height="25">


Vervangen naar dit:
<table cellpadding="0" cellspacing="0" border="0" style="width="408">
<tr>
<td colspan="2" style="font-size:12px; font-family: Arial; color: #000000; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #977e6b" height="25">
 
Ik denk dat je h5 tag bij je rekeningnummer ook niet werkt? Want je hebt geen css.

Dan moet je dus aanpassen naar normale html

<font face='lettertype' size='grootte'>
Tekst
</font>
 
Bedankt!

Ik ben even een stap terug gegaan naar het originele HTML bestand en als ik daar de line height hoger maak (dus op m'n scherm/in mail) veel ruimte tussen de regels dan is het op de iPhone ook leesbaar en staat de tekst dus niet doormekaar.

Alleen heb ik nu dus in mail/dreamwaver teveel witte ruimte tussen de regels. Is er een manier om ervoor te zorgen dat mijn lay-out hetzelfde is als die op een iPhone, maar ook op bv. iPad?
 
Laatst bewerkt:
Het lijkt erop dat je vast zit in het drijfzand dat veroorzaakt wordt door het gebruik van table én door de style in de elementen te zetten in plaats van in een aparte stylesheet (of de <head>).

De syntax klopt soms niet zoals
- style="font-size:12px; font-family: Arial; width="408"
- Al hiervoor genoemd, de laatste regels vlak boven </table> missen een <tr> </td> </tr>
- <a href="http://www.mrgl

Niet elke browser kent ieder font. Advies om meerdere fonts op te geven
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

Tip: je mag border-top-width: 1px; border-top-style: solid; border-top-color: #c1ab8b
inkorten tot border-top: 1px solid #c1ab8b;

Suc6 met je website. Have fun.
 
Laatst bewerkt:
Ik heb de handtekening gemaakt met DreamWeaver. Lijkt alsof hij dus veel te veel code gebruikt dan zou moeten.
 
Een voorbeeld zonder table, en alle css op 1 plek. Als je de css in een apart bestand zet (een stylesheet) dan ziet het er nog beter uit. Je opmaak is dan netjes gescheiden van de structuur/content.
Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Handtekening MRG</title>
<style type="text/css">
.naw {
  width: 408px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 12px;
  line-height: 1.42;
  color: #000;
}
.naw p {
  width: 100%;
  margin: 0;
  padding: 0;
}
p.naw1 {
  height: 25px;
  border-bottom: 1px solid #977e6b;
}
p.naw2 a {
  text-decoration: none;
  background: transparent;
}
p.naw2 a:active {
  outline: 0;
}
p.naw2 img {
  display: block;
  width: 250px;
  height: auto;
  vertical-align: middle;
  border: 0;
}
p.naw3 {
  padding-top: 2px;
  border-top: 1px solid #c1ab8b;
  font-size: 10px;
  color: #696969;
}
p.naw4 {
  font-size: 8px;
  font-weight: bold;
  padding-top: 40px;
  padding-bottom: 10px;
}
</style>
</head>
<body>

<div class="naw">
  <p class="naw1"><strong>Marijn Geerts</strong></p>
  <p class="naw2"><a href="http://www.mrglichtgeluid.com">
  <img src="http://i64.tinypic.com/16gy78z.jpg" alt="" /></a></p>
  <p class="naw3">info@MRGlichtgeluid.be • +32 494 11 61 69 • Straat 70, 2870 Puurs (BE)</p>
  <p class="naw4">BTW: BE0643.720.506 - IBAN: BE83 7506 7149 7315 - BIC: AXAB BE 22</p>
</div>

</body>
</html>

Ik heb met css een aantal verbeteringen aangebracht in de werking.

Suc6. Have fun.
 
Laatst bewerkt:
Ik heb een 2e persoonlijke handtekening gemaakt. Op Mail ziet deze er prima uit, van zodra ik hem kopieër en plak in m'n iPhone gaat de weg weg (ook na "herstel"). De font onder m'n naam wordt dan groter, en dus niet meer de kleinere zelf gekozen font.

Hier iemand die code goed kan aanpassen?

<table cellpadding="0" cellspacing="0" border="0" style="font-size:9px; font-family: Verdana; line-height: 10px;" width="500">

<tr>
<td><font color="#000000" size="1"><strong>Marijn Geerts<br>
</strong></font><br>
Phone: +32 494 11 61 69<br><br>
E-mail: hello@marijngeerts.com<br><br>


<span id="twitterIcon" style="display: inline;"><a href="https://twitter.com/marijngrts"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/twitter_circle_color-20.png" width="20px" height="20px"></a></span> <span id="facebookIcon" style="display: inline;"><a href="http://www.facebook.com/marijngeerts"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/facebook_circle_color-20.png" width="20px" height="20px"></a></span> <span id="gplusIcon" style="display: none;"><a href="#"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/google_circle_color-20.png" width="20px" height="20px"></a></span> <span id="linkedinIcon" style="display: none;"><a href="#"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/linkedin_circle_color-20.png" width="20px" height="20px"></a></span> <span id="instagramIcon" style="display: inline;"><a href="http://www.instagram.com/marijngrts"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/instagram_circle_color-20.png" width="20px" height="20px"></a></span> <span id="dribbleIcon" style="display: none;"><a href="#"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/dribbble_circle_color-20.png" width="20px" height="20px"></a></span> <span id="youtubeIcon" style="display: none;"><a href="#"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/youtube_circle_color-20.png" width="20px" height="20px"></a></span> <span id="vimeoIcon" style="display: none;"><a href="#"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/vimeo_circle_color-20.png" width="20px" height="20px"></a></span> <span id="githubIcon" style="display: none;"><a href="#"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/github_circle_black-20.png" width="20px" height="20px"></a></span> <span id="blogIcon" style="display: none;"><a href="#"><img src="https://s3.amazonaws.com/rkjha/signature-maker/icons/wordpress_circle_color-20.png" width="20px" height="20px"></a></span> <br> <span style="margin-left: 4px;"><a href=
</tr>

<tr> </tr>
</table>
<table cellpadding="0" cellspacing="0" border="0" style="font-size:11px; font-family: Arial; line-height: 10px;" width="500">
<tr> </tr>
<tr> </tr>
</table>
Klik om te vergroten...
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan