<!DOCTYPE HTML PUBliC "-//W3C//DTD xhtml 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><HTML xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <Title>Test</Title> <style type="text/CSS"> table { wIDth:500px; border-collapse:collapse} th,td { border:1px solID black; vertical-align: top; } th { wIDth:100px; } td { background:#ccc; } .wrap { position:relative; height:100%; padding-bottom:1em; background:#aaa; } .manage { text-align:right; position:absolute; bottom:0; right:0; } p{ margin: 0 0 5px 0; } </style> </head> <body > <table> <tr> <th>Mauris tortor nulla,sagittis ut,faucibus eu,imperdIEt ut,libero.</th> <td><div ><p>Cras diam.</p><div >Edit | Delete</div></div></td> </tr> <tr> <th>Cras diam.</th> <td><div ><p>Cras diam.</p><div >Edit | Delete</div></div></td> </tr> <tr> <th>Cras diam.</th> <td><div ><p>Mauris tortor nulla,libero. Sed elementum. Praesent porta,tellus ut dictum ullamcorper,est ante condimentum metus,non molestIE lorem turpis in sAPIen. Aenean ID enim. Nullam placerat blandit ante. Aenean ac ligula.</p><div >Edit | Delete</div></div></td> </tr> </table> </body></HTML>
如何获得包装div,以便始终填充单元格,以便管理区域位于单元格的底部?是的,我放在桌子上的数据(在我看来)的表格,所以我想在这里使用一个表.作为最后的手段,我可能会转到一个丑陋的嵌套div解决方案,但是由于表在语义上是正确的,我想使用一个如果可能的话.请注意,背景颜色只是显示元素的相对大小 – 我不关心我的布局的背景.还要注意,我希望单元格有一个灵活的高度,所以它们只能扩展到适合自己的内容.
解决方法 你可以把(固定的)高度放在桌面上因此,<style type="text/CSS">table { wIDth:500px; border-collapse:collapse}th,td { height:200px; border:1px solID black; vertical-align: top; }th { wIDth:100px; }td { background:#ccc; }.wrap { position:relative; height:200px; padding-bottom:1em; background:#aaa; }.manage { text-align:right; position:absolute; bottom:0; right:0; }p{ margin: 0 0 5px 0; }</style>总结
以上是内存溢出为你收集整理的html – 如何获得一个div垂直填充表格单元格?全部内容,希望文章能够帮你解决html – 如何获得一个div垂直填充表格单元格?所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)