![](/img/trans.png)
[英]Using JS to find screen height, then apply it to a div class through CSS
[英]Manipulating the height of a div class in an HTML table using CSS and a wicket
我有以下CSS代码:
.Divider {
padding-top:0px;
padding-bottom:500px;
}
和以下HTML
<tr>
<td align="left">
<a wicket:id="button">
<img wicket:id="buttonImg" align="center" style="width:70%"/>
</a>
</td>
<td align="left" >
<div class="Divider"/>
</td>
</tr>
我本来希望将500px作为填充添加到图像的底部。 而是将其添加到顶部和底部。 我试过摆弄高度-同样的结果。 显然,我是一个愚蠢的新手,但是谁能给我一个线索,我的愚蠢正在采取什么形式。 将不胜感激
尝试以这种方式关闭Divider div。
<div class="Divider"></div>
原始代码示例<div class =“ Divider” /> http://jsfiddle.net/rrBXU/1/
<div class =“ Divider”> </ div>的示例http://jsfiddle.net/rrBXU/2/
您应该将填充应用于图像所在的同一单元格。
您可以使用<div>
或将padding-bottom
属性应用于<img>
。
<table>
<tr>
<td align="left">
<a wicket:id="button">
<img id="buttonImg" align="center" style="width:70%"></a>
<div class="Divider"></div>
</td>
</tr>
</table>
另外,如果为包含表提供一个类,则可以使用CSS对其中的所有元素进行更好的控制。 例:
<table class="container">
<tr>
<td>
<a><img src="..."></a>
</td>
</tr>
</table>
.container { }
.container td { }
.container td img { }
您可以将img标记放入div中,并赋予其相同的样式。或者要使其变得更简单,只需添加带有“ Divider”类的新div并将图像放入其中。 代码将如下所示:
<td>
<div class="Divider">
..image or other content..
</div>
</td>
如果Divider中还有其他样式属性:
<td>
<div class="Divider2" style="padding-top:0px;padding-bottom:500px;">
..image or other content..
</div>
</td>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.