Question

填充TD标签实际上有点问题。我将在插入到TD的div上看到100％的td设置高度

如何将任何div填充到父高度的100％？

解决

<?php 
`http://jsfiddle.net/s5rbv/`
?>

在firefox 26下工作，其他浏览器我不检查，因为我不需要

Answer 1

对于你的问题：“如何将任何div填充到父高度的100％？”只需将子级的div高度设置为100％，它将填充父元素的高度。

childDIv{
    height:100%;
}

修改根据您提供的新信息，以下是您的问题的解决方案：

小提琴：http://jsfiddle.net/s4dDL/4/

HTML

<table>
<tr><td rowspan="2"><div>row 1 and 2</div></td><td>col 2</td><td>col 3</td></tr>
<tr><td>col 2</td><td>col 3</td></tr>
<tr><td>col1</td><td>col 2</td><td>col 3</td></tr>
</table>

CSS

*{margin:0;padding:0;}

table{
    border-collapse:collapse;
}

td{
    position:relative;
    height:100px;
    width:50px;  
    background-color:red;
}

td div {
    position:absolute;
    top:0;
    left:0;
    height:200px;
    z-index:10;
    background-color:green;    
}

将div设置为绝对位置，将left和top设置为0以将其设置为td元素的左上角，但需要将td设置为relative以使其工作。然后将div的高度设置为td元素高度的2倍。但是要使它出现在第二行的顶部（rowspan = 2），你需要设置一个z-index。

修改

实际上，如果你填满整个单元格，不需要使用定位，并且它无论如何都无法在firefox上运行。正如评论中指出的那样。

这是一个更新的工作小提琴：http://jsfiddle.net/s4dDL/13/

如何将DIV元素填充到td父级？

1 个答案: