如何让div占用不具有固定TD高度的html表格单元高度的100％？

我有一个HTML表和小区内我有一个div如何让div占用不具有固定TD高度的html表格单元高度的100％？

<td> 
     <div class=content>some content</div> 
</td> 
<td> 
     <div class=content>some content<br/>some content<br/>some content<br/></div> 
</td>

一些在某些细胞中的内容的多个线和div有背景色，所以我所需的视图是均匀的，所以我想内容较少的div仍然是覆盖整个td的相同高度。

我试着做

.content 
{ 
    height:100%; 
}

但是这似乎并没有改变任何东西。

来源

2014-10-11 leora

已[一直]（http://stackoverflow.com/questions/3215553/make-a-div-fill-an-entire-table-cell）[问]（HTTP：/ /stackoverflow.com/questions/3542090/how-to-make-div-fill-td-height）[several]（http://stackoverflow.com/questions/18010768/make-a-div-fill-its-parent -td-height-without-specified-height-on-td）[times]（http://stackoverflow.com/questions/19684509/how-do-i-make-a-div-fill-an-entire-table -cell），但是不存在纯粹的CSS解决方案。 – 2014-10-11 13:52:47

为什么不将背景颜色应用于td单元格？ – 2014-10-11 14:05:00

@Mr_Green - 现在我有一个围绕div（不是TD）的边框，所以看起来很有趣，但我同意我可以绕过我的CSS并将其用作解决方案 – leora 2014-10-11 14:11:02

代替将背景到内容div，适用于td单元本身。

td { 
    background-color: cornflowerblue; 
    -webkit-box-shadow: inset 0px 0px 5px 0px rgba(255, 0, 0, 1); 
    -moz-box-shadow: inset 0px 0px 5px 0px rgba(255, 0, 0, 1); 
    box-shadow: inset 0px 0px 5px 0px rgba(255, 0, 0, 1); 
    padding: 5px; 
}

我还应用插图的box-shadow这是备用的应用边界，你在你的内容div有边框太发表的评论中提到的元素（在这种情况下，小区）内。

Working Fiddle

来源

2014-10-11 14:19:50

高度是动态属性，它根据内容适用。因此你不能以百分比来设定它。但是，如果父母身高是固定的，那么孩子可以有百分比的高度属性。在这里，设置一些td的静态高度，以便你可以使用div高度。

来源

2014-10-11 13:51:23

问题在于TD的高度根据隐藏和显示中间的某些内容动态变化，因此我想避免使用TD的硬编码高度。我基本上希望div能够达到TD高度的100％，不管目前的身高是多少。。那可能吗？ – leora 2014-10-11 13:53:59

可问题是，你没有跟你的类属性使用Quotes

这里是我的代码

<table> 
    <tr> 
    <td> 
     <div >some content</div> 
</td> 
<td> 
     <div>some content<br/>some content<br/>some content<br/></div> 
</td> 
    </tr> 
</table>

退房这里JSBIN 希望它能帮助

来源

2014-10-11 13:51:28 maq

如何让div占用不具有固定TD高度的html表格单元高度的100％？

回答

相关问题