브라우저 창에있는 경우 잘 렌더링되는 HTML이 있습니다. 그러나 일부 Javascript 마법을 사용하여 다른 페이지 안에 포함 된 "라이트 박스"에 가져 오려고하면 잘못 렌더링됩니다. 즉, 표 셀 내부의 이미지가 가로 및 세로로 확장되어 표 셀을 채우도록합니다. IMG 태그에 정확한 너비와 높이가 지정되어 있습니다. 이 동작은 여러 브라우저에서 일관성을 유지하므로이 방법이 "올바른"동작을하는 것으로 가정하고이를 방지하고 포괄 HTML에 관계없이 자연스러운 크기로 이미지를 표시하는 방법이 있어야합니다.이미지가 실수로 표 셀의 너비를 채우도록 확장되었지만 특정 컨텍스트에서만 채우기.
<table style='border-collapse:collapse;margin-bottom:10px;margin-left:20px'>
<tr style=''>
<td style='text-align:right;'>
<a href='/master_page/distance_biked_page?simple=1'><img style='border:1px solid #B9B9B9;' src='/user_image/image1.jpg' width='50' height='35'/></a>
</td>
<td style='height:50px;padding-left:10px'>
<a href="/master_page/distance_biked_page?simple=1">distance biked page</a>
</td>
</tr>
<tr style=''>
<td style='text-align:right;'>
<a href='/master_page/timetracker_9_page?simple=1'><img style='border:1px solid #B9B9B9;' src='/user_image/image2.jpg' width='42' height='50'/></a>
</td>
<td style='height:50px;padding-left:10px'>
<a href="/master_page/timetracker_9_page?simple=1">time-tracker #9 page</a>
</td>
</tr>
</table>
(주 좁은 화상이 HTML이 문제 "라이트"에 렌더링 될 때 그 셀을 채우기 위해 수평으로 확장하면서 그 문맥 :
문제가 HTML 자체는 기본적으로 다음과 같이 ... 매우 간단 더 짧은 이미지는 셀을 채우기 위해 세로로 확장되지 않습니다.)
HTML 또는 CSS 전문가가 아니기 때문에 나는이 동작에 당황스러워합니다. 어떤 아이디어가 그 원인이 될 수 있습니까? 아니면 어떻게 멈출 수 있습니까?
함께 놀아 보면 같은 것을 알 수 있습니다. 매일 무언가를 배우는 것 같아요. – Tom