스마트 폰에서 읽는 HTML 링크

Question

스마트 폰에 문제가 있습니다. 스마트 폰에서 이메일을 읽을 때 링크가있는 사진이 오른쪽으로 이동합니다. 이미지의 왼쪽에는 공백이 있습니다. URL이있는 사용자 만 가능합니다.

누구든지이 문제를 해결하는 방법을 알고 있습니까? 어떻게 내가 그것을 해결 cand? 모든 패딩 및 여백을 0으로 설정하고 테두리를 0으로 설정했습니다. 그 밖의 어떤 작업을 수행 할 수 있습니까?

{ 
    display:block; 
    margin-right:0px; 
    margin-top:0px; 
    margin-bottom:0px; 
    padding-left:0px; 
    padding-right:0px; 
    padding-top:0px; 
    padding-bottom:0px; 
    outline:0; 
    border;0; 
} 

감사합니다.

Answer 1

첫째, 당신의 CSS 국경 선언에 문제가있다, 그것은해야한다 :

border: 0; 

당신은 개별적으로 각각의 패딩/마진 모서리를 선언 할 필요가 없습니다, 당신은 그냥 쉽게 사용할 수 있습니다

margin: 0; 
padding: 0; 

이미지 자체가 아닌 상위 앵커의 스타일로 인해보고있는 것으로 예상됩니다. (이 재설정 - 모든 담요의 약간 있지만, 당신은 아마이 모든 필요하지 않습니다) 다음과 같은 시도 할 수 있습니다 : 당신이 좋아하는 경우

a{ 
    display: block; 
    padding: 0; 
    margin: 0; 
    outline: 0 none; 
    border: 0 none; 
    text-indent: 0; 
    font-size: 0; 
} 

은, 코드의 조각을 넣어 어디 당신이 할 수있는 이 문제를 재현하고 좀 더 자세히 살펴볼 수 있습니까?

Answer 2

이미지 태그에 CSS 인라인이 있어야합니다. CSS를 정돈 할 수도 있습니다. 당신의 격차가 계속되면

<a href=""><img alt="" src="" width="" height="" style="margin: 0; border: 0; padding: 0; display: block;"></a> 

,이 때문에 부모 요소의, 또는 다른 CSS 당신이 (가) 또는 이미지 태그를 가지고 : 여기

은 HTML 이메일에 링크 된 이미지에 필요한 모든 것입니다 . html-email의 각 이미지를 자신의 <td>으로 유지하는 것이 좋습니다. 위의 태그를 자체 표 셀에 배치하면 완벽하게 작동합니다.

또한, 귀하의 header style tag for Outlook이 추가 :

#outlook a {padding:0;}