Facebook应用程序中iframe中的填充错误答案

【问题标题】：Padding bug in iframe in Facebook appFacebook应用程序中iframe中的填充错误
【发布时间】：2011-08-04 08:11:07
【问题描述】：

来自潜伏者的第一篇文章，所以请多多包涵。

在我公司的 Facebook 应用程序中，有一个表单可能包含错误消息，这些消息会出现双左填充。它们有相当多的填充来与它们上面的输入对齐（这也得到了左边的填充）。

当我从 Facebook iframe 中弹出同一页面时，它正常显示，表单元素和错误消息排列整齐。

实际的代码是一个继承的（在所有意义上的）混乱，但确实适用于包括 IE6 和 7 在内的所有东西，没有 hack。以下是这些 lis 上的所有非重置样式：

clear: none;
font-size: 12px;
margin-bottom: 0;
margin-top: 5px;
overflow: hidden;
padding-left: 160px;

我已经确认将填充加倍会导致视图混乱（我只能在非混乱视图中使用 IE 开发工具，因为它无法处理 iframe）。

有人知道吗？除了撕掉这个旧代码并重新开始？

更新：似乎撕掉旧代码可能是必要的。我有一些没有孩子的 UL，可能会导致一些破损。

UPDATE 2：动态生成的dom是一团糟，但是这里的工程师没有时间重构它，所以我可能永远也得不到这个问题的答案。 :(

【问题讨论】：

【解决方案1】：

这可能不是一个理想的解决方案，但我会使用一个条件和一个单独的 IE9 样式表来解决这个问题。

类似：

    <!--IF[IE 9]-->
      // Include IE9 stylesheet here
<![endif]-->

在那个样式表中可能会做这样的事情：

clear: none;
font-size: 12px;
margin-bottom: 0;
margin-top: 5px;
overflow: hidden;
padding-left: 80px; /* half the padding */

【讨论】：

【解决方案2】：

你在用花车吗？我通过类似的问题提出了这个问题。

【讨论】：