相关疑难解决方法(0)

在IE 6和7中使用列表和表格进行绝对定位/ Z-Index时遇到问题

我正在创建一个基于CSS/XHTML表的日历的原型,最终将使用PHP为Simple Updates内容管理系统生成.我遇到了一个问题,即使用绝对定位来创建一个弹出窗口,该弹出窗口会在一天内显示所有事件,而这些事件不仅适合单元格.问题可以在这里看到:

http://sutest.bravehost.com/

如您所见,弹出窗口在IE7和IE6中的多日事件和日期下弹出.在弹出窗口上放置z-index修复了Firefox中的问题.我已经尝试在弹出窗口中放置各种z-index值,更改弹出窗口和相关元素的显示属性,以及许多其他不同的方法,但没有成功.

HTML如下:

<td valign="top"><div>
    <div class="date">25</div>
    <ul>
        <li class="single"><a href="#">History</a></li>
        <li class="single"><a href="#">Biology</a></li>
        <li class="single"><a href="#">Computers</a></li>
        <li class="single"><a href="#">POTCH</a></li>
        <li class="single"><a href="#">Precal</a></li>
        <li class="more"><a href="#">+3 More</a></li>
    </ul>
    <div class="popup">
        <span class="close"><a href="#">X</a></span>
        <ul>
            <li class="single"><a href="#">History</a></li>
            <li class="single"><a href="#">Biology</a></li>
            <li class="single"><a href="#">Computers</a></li>
            <li class="single"><a href="#">POTCH</a></li>
            <li class="single"><a href="#">Precal</a></li>
            <li class="single"><a href="#">Science PC</a></li>
            <li class="single"><a href="#">Physics</a></li>
            <li class="single"><a href="#">Construction</a></li>
        </ul>
    </div>
</div></td>
Run Code Online (Sandbox Code Playgroud)

这是表格中带有硬编码弹出窗口的单元格.第一个列表包含正常的可见事件.包含第二个div的div是弹出窗口.它应该显示在多日活动中:

<td valign="top" class="blank"><div>
    <div class="date">2</div>
    <ul>
        <li style="background-color:plum;">&nbsp;<img src="endr.png" alt="." /></li>
    </ul>
</div></td>
Run Code Online (Sandbox Code Playgroud)

我正在使用列表项来"伪造"多日活动.这一天的li被设计为看到在IE 6和7中弹出窗口的条形图. …

css html-table list z-index css-position

11
推荐指数
1
解决办法
2万
查看次数

标签 统计

css ×1

css-position ×1

html-table ×1

list ×1

z-index ×1