在td中获取一个表来填充100％的高度 [英] Getting a table to fill 100% height in a td

问题描述

我正在尝试用适当的HTML重写网站。我试图替换的网站是一个完整的混乱。我遇到了一个问题，我无法获得< table> 来填补< td> 它包含在。我已尝试在< table> 上设置 height：100％，基于谷歌和stackoverflow研究应该工作，但我必须错过一些愚蠢的东西。在切换到表格之前，我曾试图用< divs> 做同样的事情，但我并不反对回到< divs> ; 如果有人可以建议怎么做。

I'm trying to rewrite a site in proper HTML. The site I'm trying to replace was a complete mess. I've run into a problem where I can't get a <table> to fill the height of the <td> it's contained in. I've tried setting height: 100% on the <table>, which based on google and stackoverflow research should work, but I must be missing something stupid. I had tried to do the same thing with <divs> before switching to tables, but I'm not opposed to going back to <divs> if someone can suggest how to do it.

我正在开发的内容目前在这里： http： //96.0.22.228 /

The content I'm developing is currently here: http://96.0.22.228/

由于项目时间的限制，我不得不使用糟糕的黑客来让网页看起来正确。我没有声明< doctype> 而且我强迫IE使用IE7-quirks模式。我很想知道如何使用HTML5和CSS以适当的方式进行此布局。它不必支持旧版浏览器，但在最新版本的Chrome，Firefox和IE中看起来必须相同。我还想废除菜单的图像，并在CSS中为边框和菜单文本设置样式。

Due to project time constraints, I've had to use bad hacks to get the pages looking correctly. I'm not declaring a <doctype> and I'm forcing IE to use IE7-quirks mode. I'd love to have recommendations on how to do this layout in a proper manner using HTML5 and CSS. It does not have to support older browsers, but it does have to look the same in the latest versions of Chrome, Firefox and IE. I'd also like to to do away with the images for the menus and style everything in CSS for the border frames and the menu text.

尽管我已经有了如果对这个问题有一个很好的答案，我可以回去修理它。

Even though I've had to complete the site as is, I'm open to going back and fixing it later if there's a good answer to this problem.

推荐答案

表格单元格中100％的高度总是很痛苦。从技术上讲，TD没有高度（因为这取决于其内容）。你要求浏览器做的是让孩子100％的父母，这是其孩子的100％，这是其父母的100％...你可以看到这可能是一个问题。

100% height in a table cell is always a pain. Technically speaking a TD has no height (because that depends on its contents). What you are asking the browser to do is make the child 100% of its parent, which is 100% of its child, which is 100% of its parent ... You can see how that might be a problem.

您可以尝试在TD上添加显式高度并使用table-layout：fixed固定在表格上。至少通过这种方式，浏览器知道父级的高度，而不需要孩子的高度，但仍然可能无效。

You could try adding an explicit height to the TD and using table-layout:fixed on the table. At least that way the browser knows the height of the parent without needing the height of the child but that still may not work.

您可能需要重新考虑如何去做这个。

You might need to rethink how you go about this.

这篇关于在td中获取一个表来填充100％的高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！