html을 사용하여 이미지 간 공백 제거

이 문제에 대한 여러 가지 답변을 읽은 후에는 문제가 해결되지 않은 것 같습니다. 나는 VerticalResponse를 통해 이메일을 보내고 이메일을 보내려하고 있으며 HTML을 사용하고있다. 메시지는 링크가있는 여러 개의 이미지를 스태킹하여 만들어 지지만 하나의 이미지처럼 보이게되어 있습니다. 문제는 미리보기가 좋게 보이고 웹 페이지에서 미리보기가 표시되지만 이메일 디스플레이는 각 이미지 사이에 공백을 표시합니다. 코드는 http://jsfiddle.net/xMW7N/42/을 참조하십시오. 도와주세요!html을 사용하여 이미지 간 공백 제거

<body> 
    <div style="text-align: center; "> 
     <span style="font-size:8pt;"><a href="website"><img align="normal" alt="Facebook - MetricRunFest" border="0" height="126" hspace="-20" name="FB" src="https://141790a61d-custmedia.vresp.com//a091cd9b91/Top.jpg?0.7593426643870771" style="width: 600px; height: 126px;" title="Facebook - MetricRunFest" vspace="0" width="600" /></a></span><br /> 
     <span style="font-size:8pt;"><a href=website"><img align="normal" alt="Metric Runners - Online Photos" border="0" height="205" hspace="-2" name="MetricRunFest - Online Photos" src="https://141790a61d-custmedia.vresp.com//a091cd9b91/Message%20Blank.jpg?0.8384064519777894" style="width: 600px; height: 205px;" title="Metric Runners - Online Photos" vspace="0" width="600" /><br /> 
     <img align="normal" alt="website" border="0" height="127" hspace="-2" src="https://141790a61d-custmedia.vresp.com//a091cd9b91/Message%20Blank_UpsideDown%209.jpg?0.44395816628821194" style="width: 600px; height: 127px;" title="website" vspace="0" width="600" /></a></span><br />

출처

2012-11-20 Keith Levasseur

다른 브라우저는 공백을 다르게 취급합니다. 그것은 어떤 불필요한 공간으로, 가능하면 한 줄에 모든 것을 쓰는 것이 좋다 또는 newlines.You는 다음과 같이 시도 할 수 있습니다 : -

<span><img src="image1.jpg"></span><span><img src="image2.jpg"></span><span><img src="image3.jpg"></span>

출처

2012-11-20 20:39:45

나는 그것이 대부분의 이메일 클라이언트는 쓰레기 때문에 "최고",이 이메일에 관해서 그러나 그것은 약간의 공백 문제를 해결 않습니다, 한 줄에 그것을 유지하는 것에 동의 할 수 없다. – Nix

@Nix : - "good"이 "best"보다 나은가요? –

이메일 클라이언트 용으로 개발할 때 해결해야 할 몇 가지 이상한 단점이 있기 때문에 이메일 개발과 웹/기타 개발을 구분해야한다고 생각합니다.이 이상한 화이트 스페이스 버그는 해결되었습니다. 하나의 라이너로 – Nix

나는 HTML 이메일에 본 모든, 나는 그들에게 자신을 일에이 경험에서 가장 좋은 방법은 테이블을 사용하는 것입니다. 정말 모든 레이아웃 문제를 도울 수 있습니다.

http://24ways.org/2009/rock-solid-html-emails은 이미지의 전체 섹션을 비롯한 많은 도움말을 읽어 보시기 바랍니다. 특히 Hotmail의 경우 img {display:block;}을 사용하고 floats 대신 <img src="image.jpg" align="right">과 같은 align을 사용합니다.

반드시 그런 부분을 잘못하고있는 것은 아니지만 일반적으로 기억하는 것이 좋습니다.

출처

2012-11-20 20:49:42 gotohales

문제의 일부인 모든 이미지 사이에 간격이 있습니다. 또한 이미지에 display: block 스타일을 사용해보십시오.

http://jsfiddle.net/xMW7N/47/

출처

2012-11-20 20:53:43 JoshNaro

감사! 모양이 좋고 Gmail이 끝날 때까지 올바르게 표시됩니다. 그렇지 않으면 문제가 될 수 있습니다. –

html을 사용하여 이미지 간 공백 제거

답변

관련 문제