無法刪除邊框間距表

我想在附件中的例子圖片和灰色區域粘在一起和相同的高度 - 但我似乎無法移除[摧毀這個邊框間距。無法刪除邊框間距表

關於我在做什麼錯的任何想法？對於凌亂的樣式表感到抱歉。

PS：我知道這可以通過div的來解決，但是這是一個非常特殊的環境。

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 

<style> 
    body { 
    background-color: #efefef; 
    border: 0px; 
    margin: 0px; 
    } 


    h1, h2, h3 { 
     color: #333333; 
     margin: 0px; 
     font-family: Verdana, Helvetica; 
    } 

    } 
    h1 {font-size: 21px;} 
    h2 {font-size:18px;font-weight:bold;} 
    h3 a {color: #0269cd; text-decoration: none; text-decoration: none;font-weight:bold;} 

    table.module{border-spacing:0!important;background-color: #ffffff;border-collapse: collapse;} 

    h3 {font-size: 16px;font-weight:normal;} 

    html,body{min-width:600px;} 

</style> 
</head> 
<body style="background-color: #efefef;"> 
<div style="padding-top:150px;padding-bottom:150px;background-color:white;"> 
<table width="600" height="242" align="center" border="0" cellspacing="0" cellpadding="0" class="module" > 
<tr> 
<td width="263" height="242" style="padding-left:30px;"><a href="http://www.cnn.com"> <img src="http://placekitten.com/263/242" width="263" height="242" alt="Module2_img"></a></td> 

<td width="277" height="242" align="left" style="padding-left:18px;background-color:#efefef;"> 
<h2>Content</h2><br> 
<h3>There should be a cute cat on the left <br><br> 
<a href="http://www.ikea.no/">Click this</a></h3> 


</td> 
</tr> 
</table> 
</div> 

</body> 
</html>

來源

2017-02-20 user977101

我能夠通過更改兩件事來解決這個問題。

爲了讓您的圖像堅持列的右側，您需要增加第二個單元格的填充從18px到30px。或者，您可以使每個單元格的寬度相同，然後將圖像浮動到右側。

要擺脫圖像下方的額外填充，您需要將display: block;添加到受影響的圖像。 <img>是一個內聯元素，因此它會在其下面留下額外的填充以爲其他元素（如文本）騰出空間。

如果因爲任何原因不能使用display: block;，vertical-align: bottom;也可以使用。這將允許您保持圖像內聯，並將設置圖像的垂直對齊，以便它匹配表單元格的底部。

來源

2017-02-20 14:39:28

無法刪除邊框間距表

回答

相關問題