Question

编辑08.02.2017： 我不需要支持每个浏览器，因为我正在使用最新的electron-framework。哪个在Chromium 56.0.2924.87

上运行

我有一个可编辑的table，在用户可以编辑之前用一些数据进行初始化。由于我想稍后以A4格式打印该表，因此不得超过给定的宽度。

我现在的问题是，如果我使用

table-layout:fixed;
width:100%;

可编辑的TDs将不再流畅。当然我知道这是一个悖论，fixed不能是fluid ......

但是我确信2017年必须有办法fixed table fluid td。{/ p>

以下是没有固定表的示例：https://jsfiddle.net/stjkd2xs/

正如您所看到的，只要您使用小词，table就不会超过它的父级。 TDs为fluid。但是，如果你开始写一个长单词，table会突破它的父级。

以下是一个固定布局的示例：https://jsfiddle.net/jdedo87z/

在此示例中，table将使用所有父级宽度，这很好。但是TDs本身会有一个固定的宽度，这是不好的。

我希望以某种方式实现TDs fluidly fixed table {/ 1}}。

有没有一种纯粹的CSS方式吗？
还有其他方法可以解决这个悖论吗？
旁注：我正在考虑完全删除table并使用divs而不是......

期待你的建议。

问候，Megajin

Answer 1

这不是表的工作方式......

但你可以尝试这样的事情：

<div class="phreak">
  <div class="freak-box">
    <div class="squishy-inside">
      When Tom came home from the park, he opened the door to his home and found something was amiss. A lamp was knocked to the ground and there was strange noises coming from the kitchen. He felt his chest tighten as he thought of his wife, Sarah, was she ok or was she in there... where the noises were?
    </div>
  </div>
</div>

{{1}}

在修复TABLE时，是否可以保持TD流畅？

1 个答案: