1

这是我的标记（现场重现）：

<body>
  <div style="text-align:center">header <input class='datepicker'/></div>
  <table><tr><td>really wide table.....................</td></tr></table>
</body>

当 datepicker 被激活时，header div 的宽度从屏幕的宽度变为表格的宽度（更大）。这会导致标题的居中内容转移到新的中心……这很烦人。

这发生在 IE6 中，但不会出现在 FF3.5、IE8 或 IE8-compat-mode 中。

将标题 div 的宽度固定为窗口宽度（而不是内容）的最佳方法是什么？

注意：可能有一个比 datepicker 更简单的示例——可能不涉及 jQuery——这只是触发了我的触发器，所以我以这种方式发布它。这是一个添加 dom 元素而不触发此问题的示例。

4

1 回答 1

1

容器或 CSS 指令的简单组合似乎不适合我。这是我最终做的事情（我的堆栈中已经有 jquery）：

// set the header div's width in px on page load/window resize
$(window).bind('load resize', function() {
  $('#header').css('width', $(window).width() - 20 /* scrollbars */);
});

这肯定是一种胶带解决方案：它治疗症状多于根本原因......但它似乎工作得很好，我可以继续做更好的事情。

我相信这个问题存在一个纯 CSS 解决方案......如果你有它，请发布它！

于 2009-10-21T00:39:03.073 回答