如何使用CSS使HTML <button> 垂直填充表格单元格？

Question

我该如何使用CSS使HTML的<button>在表格单元格中垂直填充？

我可以使用width:100%来使按钮水平填充表格单元格，但是height:100%没有任何作用。

请参考以下示例：http://jsfiddle.net/eA5fQ/ 谢谢！

- PleaseHelpMe

---

你能再清楚一点吗？你想用CSS做什么？ - Suraj

百分比高度是从元素的父级继承的。如果父级的高度未定义，则没有参考点。 - Diodeus - James MacFarlane

Answer 1

您需要指定高度为像素，例如：

height: 100px;

height: 100px;

- Ken Pespisa

---

谢谢Ken，那肯定可以，但是有没有任何方法可以通过%来完成，以便它只占据所在表格单元格的整个区域？ - PleaseHelpMe

Answer 2

如果您不介意使用jQuery解决方案：

$('#button1').css('height', $('#button1').parent('td').height());

演示实例

- drudge

Answer 3

将height:100%;添加到您的按钮，并将您的标签的高度设置为百分比

- DerBesondereEin

---

是的，在 td 上设置 100%，并在 td 内部的按钮上设置。谢谢，问题已解决。 - Thomas Andreè Wang

Answer 4

如果您同时使用min-height: 1px;和height: 100%;，它似乎可以正常工作：http://jsfiddle.net/jJbCd/8/

- penguinrob

---

我很想用％来完成，但在我的浏览器（Firefox 4）上无法正常工作。你有什么想法吗？谢谢。 - PleaseHelpMe

我不确定我理解了。无论是否设置min-height，高度100％都适用于我。在TD标签和div中都可以使用。http://jsfiddle.net/jJbCd/9/同时在使用FF4（xp）。 - kjl

如果它能够正常工作，那么你可能不需要它。 :-) 如果没有必要，就把它拿掉。 - penguinrob