IE不能正确显示，Firefox确能正确显示，求：通用的ＣＳＳ的写法

fwqlove 2006-08-18 12:34:41

菜单形式

Menu
├MenuA
│ └MenuA1
│　└MenuA11
│　├ItemA110
│　├ItemA112
│　├ItemA113
│　└ItemN...
├MenuB
├MenuC
└MenuD

当子菜单很多时，会自动出来<< 和 >>用于调整。当子菜单超出二级时，会自动在子菜单前面加上　MenuX > Menuxxx 表示菜单关系。。

样子不正确。。IE不能正确显示，Firefox确能正确显示

求：ＣＳＳ的写法

代码==================================
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<style type="text/css">

</style>
</head>

<body>
<table width="100%" border="0" cellpadding="3" cellspacing="0">
<tr>
<td width="150" rowspan="2" align="center" bgcolor="#CCCCCC">Logo</td>
<td>
<table border="0" cellspacing="0" cellpadding="0">
<tr align="center">
<td width="50" height="20" bgcolor="#666666"><span class="style1">MenuA</span></td>
<td width="50" height="20" style="cursor:pointer;" onMouseOver="this.bgColor='CCCCCC';" onMouseOut="this.bgColor='';">MenuB</td>
<td width="50" height="20" style="cursor:pointer;" onMouseOver="this.bgColor='CCCCCC';" onMouseOut="this.bgColor='';">MenuC</td>
<td width="50" height="20" style="cursor:pointer;" onMouseOver="this.bgColor='CCCCCC';" onMouseOut="this.bgColor='';">MenuD</td>
</tr>
</table></td>
</tr>
<tr>
<td bgcolor="#E8E8E8"><table width="100%" border="0" cellspacing="1" cellpadding="2">
<tr>
<td width="1" height="20"><span style="white-space:nowrap;"><a href="#">MenuA1</a> > MenuA11</span></td>
<td width="1" align="center" bgcolor="#CCCCCC" style="cursor:pointer;"><<</td>
<td><div id="div5"><a href="#">ItemA110</a> <a href="#">ItemA111</a> <a href="#">ItemA112</a> <a href="#">ItemA113</a> <a href="#">ItemA114</a> <a href="#">ItemA115</a> <a href="#">ItemA116</a> <a href="#">ItemA117</a> <a href="#">ItemA118</a> <a href="#">ItemA119</a> <a href="#">ItemA1110</a> <a href="#">ItemA1111</a> <a href="#">ItemA1112</a> <a href="#">ItemA1113</a> <a href="#">ItemA1114</a> <a href="#">ItemA1115</a> <a href="#">ItemA1116</a> <a href="#">ItemA1117</a> <a href="#">ItemA1118</a> <a href="#">ItemA1119</a></div></td>
<td width="1" align="center" bgcolor="#CCCCCC" style="cursor:pointer;">>></td>
</tr>
</table></td>
</tr>
<tr bgcolor="#999999">
<td height="2" colspan="2" align="center" bgcolor="#999999"></td>
</tr>
</table>
<p>菜单形式</p>
<p>Menu<br>
├MenuA<br>
│ └MenuA1<br>
│　└MenuA11<br>
│　　
├ItemA110
<br>
│　　 ├ItemA112<br>
│　　 ├ItemA113<br>
│　　 └ItemN...<br>
├MenuB<br>
├MenuC<br>
└MenuD</p>
<p>当子菜单很多时，会自动出来<< 和 >>用于调整。当子菜单超出二级时，会自动在子菜单前面加上　MenuX > Menuxxx 表示菜单关系。。</p>
<p>样子不正确。。IE不能正确显示，Firefox确能正确显示</p>
<p>求：ＣＳＳ的写法</p>
</body>
</html>

...全文

213 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

ImN1 2006-08-18

打赏
举报

自动调整比较难
自动调整需要无尺寸，但overflow需要有尺寸

fwqlove 2006-08-18

打赏
举报

回复：snmr_com(麒麟厍人)

可是我想让单元格跟据内容的多少，不换行，自动调整宽度。
如果像这样 MenuA1 > MenuA11 > MenuA111 ...
不知道有多少级菜单以及文本的长度，不能设置固定大小，最好是让它自动调整。

设置这一项之后。
table{border-collapse:collapse;table-layout:fixed;}

这一项就失效了。
<td width="1" height="20"><span style="white-space:nowrap;">...</span></td>

ImN1 2006-08-18