css - 使用百分比大小的输入在 Webkit 中无法正确呈现

Question

我被分配了一项奇怪的任务。

我们有一个表单的 png 图像，我们正在其上叠加 HTML 表单元素。由于我们的用户使用各种设备，因此我必须对其进行设计，以便调整表单大小以保持在浏览器宽度的 95%。因此，所有表单元素都使用百分比来定位和调整大小(是的，我知道这很丑陋，但它确实有效)。

我注意到我认为是一个错误，想知道是否还有其他人遇到过这个问题:在 Webkit 浏览器上，仅在 Mavericks 上，而且只是偶尔出现，当页面加载时，字段显示为空白。它们有值(可以通过触发 jQuery .val() 命令来证明)，但它们只是不可见。在调整窗口大小或选择一个字段时，该值会神奇地出现。

这让我感到非常困惑，而且奇怪的是它是如此孤立的各种因素。

有没有其他人能够复制或遇到过这个问题，以及我如何解决这个问题的任何想法？我实际上已经能够做一个“hacky-fix”，在页面加载时，我将主要内容 div 的大小从 95% 调整到 95.01%，重绘修复了所有问题，但我不喜欢这样破解。

Answer 1

我们遇到了完全相同的问题，我们发现根本原因是我们用来显示从 alpha 0 到 100 的页面的 css 转换。因此，一旦我们删除该转换，所有字段都会正确显示。顺便说一句，我喜欢你破解