이미지가 전체 크기로로드되지 않는 이유는 무엇입니까?

Question

테이블 기반 레이아웃을 만들고 테이블 너비를 550px로 지정해야합니다. 그리고 나서 원본 너비 550px로 이미지를로드했지만 브라우저에는 449px 밖에 없습니다. 전폭으로 만들고 싶습니다. 또한 세포 사이에 여분의 공간이 있습니다.

<table style="width:550px;margin:0 auto;" cellspacing="0" cellpadding="0" border="0"> 
      <tr style="margin:0; padding:0;"> 
       <td style="font-size:12px; line-height: 12px; width: 100%; text-align: right; color:#5A99B1;">Click <b>here</b> for the online version</td> 
      </tr> 
      <tr> 
       <td style="width:100%; height:10px;" cellspacing="0" cellpadding="0"> 
        <img style="width: 100%;" src="border-top.png" /> 
       </td> 
      </tr> 
      <tr> 
       <td style="width:50%; background-color:white;"> 
        <img src="brugadalogo.png" /> 
       </td> 
       <td style="width:50%; background-color:white; text-align: right;"> 
        <img src="msdlogo.png" /> 
       </td> 
      </tr> 
     </table> 

Answer 1

테이블 열이 균일하지 않습니다. 당신은 3 행, 첫 번째 2는 1 열, 그리고 마지막 행은 2 열입니다. 적절한 비율을 가지고 있다고해도 균등하게 분배하는 것이 좋습니다. 이러한 모든 3 행을 가지고 또는 "2"열의 공간을 가져 가라.

너비를 사용하는 대신 colspan을 사용해야한다는 의미입니다. 또한 이미지에서 너비를 제거하십시오. 원래 크기를 원하면 기본적으로 가져와야합니다.

<table style="width:550px;margin:0 auto;" cellspacing="0" cellpadding="0" border="0"> 
      <tr style="margin:0; padding:0;"> 
       <td **colspan="2"** style="font-size:12px; line-height: 12px; text-align: right; color:#5A99B1;">Click <b>here</b> for the online version</td> 
      </tr> 
      <tr> 
       <td **colspan="2"** style="height:10px;" cellspacing="0" cellpadding="0"> 
        <img src="border-top.png" /> 
       </td> 
      </tr> 
      <tr> 
       <td style="background-color:white;"> 
        <img src="brugadalogo.png" /> 
       </td> 
       <td style="background-color:white; text-align: right;"> 
        <img src="msdlogo.png" /> 
       </td> 
      </tr> 
     </table> 

희망이 당신의 문제를 해결합니다.