Html Gmail:大于内联css样式中定义的大小的元素
因此,我正在编写一份时事通讯的html,由于受到限制,我正在使用内联样式,因此我的表布局被破坏,因为有大小大于定义值的元素。 我意识到一个定义了170px高度的元素,其中有一个定义了170px高度的标签,所以为什么使用inspect我可以看到这个有172px,我认为Gmail忽略了一些东西 我制作了一个gif以在inspector中显示: 我的JSFIDLE和我的html: 带有马里奥图像的框显示布局中断的位置 如果您不想在JSFIDLE中看到:Html Gmail:大于内联css样式中定义的大小的元素,html,css,gmail,html-email,Html,Css,Gmail,Html Email,因此,我正在编写一份时事通讯的html,由于受到限制,我正在使用内联样式,因此我的表布局被破坏,因为有大小大于定义值的元素。 我意识到一个定义了170px高度的元素,其中有一个定义了170px高度的标签,所以为什么使用inspect我可以看到这个有172px,我认为Gmail忽略了一些东西 我制作了一个gif以在inspector中显示: 我的JSFIDLE和我的html: 带有马里奥图像的框显示布局中断的位置 如果您不想在JSFIDLE中看到: <table width="700"
<table width="700" align="center" style="background-image: url('http://www.image.test.com/images/bg.jpg'); background-color: #ededed; background-position: center top; background-repeat: no-repeat; margin:0;padding:0;padding: 0; width: 700px; margin: 0 auto;">
<tr width="600" style="border-collapse:collapse;border-spacing:0;">
<td style="border-collapse:collapse;border-spacing:0;">
<table width="600" align="center" border="0" cellpadding="0" cellspacing="0" style=
"border-collapse:collapse;border-spacing:0;">
<thead width="600" style="border-collapse:collapse;border-spacing:0;">
<tr width="600"height="150" style="border-collapse:collapse;border-spacing:0;">
<th width="600" style="border-collapse:collapse;border-spacing:0;">
<img src="http://www.image.test.com/images/header.png" width="600" height="151">
</th>
</tr>
<tr height="104">
<th style="height:104px; border-bottom: 5px #ededed solid;">
<img src="http://www.image.test.com/images/update.png" width="600" height="104">
</th>
</tr>
</thead>
<tbody width="600">
<tr height="170">
<th height="170">
<a style="height:170px;" href="http://www.test.com/motorola-droid-turbo/65466-moto-maxx-chega-oficialmente-brasil-preco-r-xxxx.htm" target="_blank"><img src="http://www.image.test.com/images/moto-maxx.png" width="600" height="170"></a>
</th>
</tr>
<tr height="180">
<th height="170">
<a style="height:170px;" href="http://www.test.com/jogos/65442-explosivo-trailer-gameplay-gta-v-confirma-modo-primeira-pessoa.htm" target="_blank"><img src="http://www.image.test.com/images/gta-v.png" width="600" height="170"></a>
</th>
</tr>
<tr>
<table width="600" height="340" align="center" border="0" cellpadding="0" cellspacing="0" style=
"border-collapse:collapse;border-spacing:0;">
<tr>
<th height="170" style="height: 170px; width: 200px;border-collapse:collapse;border-spacing:0;">
<a style="height: 170px; width: 200px;border-collapse:collapse;border-spacing:0;" href="http://www.test.com/moto-x/65400-analise-review-smartphone-motorola-novo-moto-x-2014.htm" target="_blank"><img src="http://www.image.test.com/images/moto-x.png" width="200" height="170"></a>
</th>
<th height="170" style="height: 170px; width: 200px;border-collapse:collapse;border-spacing:0;">
<a style="height: 170px; width: 200px;border-collapse:collapse;border-spacing:0;" href="http://www.test.com/iphone-6/64640-analise-apple-iphone-6-review.htm" target="_blank"><img src="http://www.image.test.com/images/iphone.png" width="200" height="170"></a>
</th>
<th rowspan="2" height="340" style="width: 200px; height: 340px;border-collapse:collapse;border-spacing:0;">
<a style="width: 200px; height: 340px;border-collapse:collapse;border-spacing:0;" href="http://www.test.com/jogos/65339-personagens-super-mario-viram-brindes-mcdonalds-brasileiro.htm" target="_blank"><img src="http://img.elo7.com.br/product/original/62C89A/painel-mario-bros.jpg" width="200" height="340"></a>
</th>
</tr>
<tr width="400" height="170">
<th height="170" colspan="2" style="border-collapse:collapse;border-spacing:0;">
<a style="width:400px;height:170px;border-collapse:collapse;border-spacing:0;" href="http://www.test.com/celular/65283-dinossauros-9-celulares-marcaram-epoca.htm" target="_blank"><img src="http://cdn.bgr.com/2013/11/super-mario-3d-world.jpg" width="400" height="170"></a>
</td>
</tr>
</table>
</tr>
<tr>
<table width="700" align="center" border="0" cellpadding="0" cellspacing="0" style=
"border-collapse:collapse;border-spacing:0;background:#ededed;">
<tr align="center" height="170" style="border-collapse:collapse;border-spacing:0;">
<th height="170">
<a href="http://www.test.com/cinema/65416-30-filmes-2015-voce-querer-ver-cinemas-estreias-lancamentos.htm" target="_blank"><img src="http://www.image.test.com/images/filmes.png" width="600" height="170"></a>
</th>
</tr>
<tr height="180" align="center" style="border-collapse:collapse;border-spacing:0;">
<td colspan="2" style="width:400px;height:170px;border-collapse:collapse;border-spacing:0;">
<img src="http://www.image.test.com/images/grupo-nzn.jpg" width="600" height="180">
</td>
</tr>
</table>
</tr>
</tbody>
</table>
</td>
</tr>
有人能帮上忙吗?这是与道路有关的事情
您需要将显示:块;在你所有的img标签上内联。在JSFIDLE中它可以工作,但在Gmail中不工作可悲的是,Gmail不接受标签,我把这个显示块放在所有元素的内联中,但不修复,你有其他想法吗?它对我来说也是内联风格的。。。你确定你把它都放进去了吗?
<style>
a {
display : block;
}
</style>