1

我设法让 YUI 日历小部件正常工作。但是当它显示时,它不会“浮动”在页面上,也就是说,它会将内容推到异形。我需要它漂浮在页面上方并且不影响其他元素。

似乎没有强制日历浮动在页面上的属性。

有谁知道如何确保小部件在显示时浮动在页面上方。显示小部件的按钮位于表格内。下面的 HTML

<tr>
<td>Expiry Date</td>
<td><input name="ExpiryDate" value="" id="ExpiryDate">
         <img id="calico" src="resources/images/calendar_icon.gif" />
          <div id="calWidget"></div>
</td>
</tr>
4

1 回答 1

1

设法找到解决方案。当所有其他方法都失败时..只需添加更多 HTML 和样式。

首先用另一个 div 包装“calWidget”(我们将给出“calPanel”的 id)。它看起来像这样。

<tr>
<td>Expiry Date</td>
<td><input name="ExpiryDate" value="" id="ExpiryDate">
         <img id="calico" src="resources/images/calendar_icon.gif" />
          <div id="calPanel">
             <div id="calWidget"></div>
          </div>
</td>
</tr>

然后使用一些简单的 CSS,“相对”的 calPanel 围绕“绝对”定位的 calWidget。您可以使用“#calWidget”CSS 中的左/右/上/下从那里设置日历的位置。

#calPanel {
    position:relative;
}

#calWidget { 
    display:block; 
    position:absolute; 
    left:0px;
    z-index:99;
}

IE7/8 和 FF3+ 中的定位似乎是一致的...希望这对您有同样的问题有所帮助...

于 2010-03-11T01:23:00.863 回答