菜单中级联的问题 [英] Problems with cascade in menus

查看:60
本文介绍了菜单中级联的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

像往常一样,它在Firefox 3中看起来是正确的,但在IE6中却看不到。


参见 http://www.tc3.edu/instruct/sbrown/n.../indexgood.htm

对于所需的行为 - 当您将鼠标悬停在第二个或第三个
主菜单项上时,会出现一个子菜单,并且可以选择一个项目。 (

链接不能去任何地方。)这适用于FF和IE。

样式表是
http://www.tc3.edu/instruct/sbrown/prodrop4.css


但是当我加入自己的样式表时
http://www.tc3.edu/instruct/sbrown/screen.css

除了prodrop4.css之外,那么FF仍然有效,但IE现在有一个主线和子菜单之间的间隔是

,所以当你尝试鼠标转到
a子菜单时,主项目不再悬停,子菜单

消失了。见
http://www.tc3.edu /instruct/sbrown/n...s/indexbad.htm


我确定有关于sub-br的尺寸或位置的信息。 />
菜单(内部UL)没有在prodrop4中明确指定,

但是在使用Mozilla DOM检查员几个小时之后我还没有

能够找到它。


有人可以指出我错过了什么吗?谢谢!

-

Stan Brown,Oak Road Systems,美国纽约汤普金斯县
http://OakRoadSystems.com/

HTML 4.01规范: http://www.w3.org/TR/html401/

验证者: http://validator.w3.org/

CSS 2.1规范:< a rel =nofollowhref =http://www.w3.org/TR/CSS21/target =_ blank> http://www.w3.org/TR/CSS21/

验证者: http://jigsaw.w3.org/css -validator /

为什么我们不能帮助你:
http://diveintomark.org/archives/200..._wont_help_you

解决方案

< blockquote>太阳,27 J ul 2008 16:07:39 -0400来自Stan Brown

< th ************ @ fastmail.fm>:


但是当我加入自己的样式表时
http://www.tc3.edu/instruct/sbrown/screen.css

除了prodrop4.css,然后FF仍然有效,但IE现在有差距<主线和子菜单之间的
,所以当你尝试鼠标转到
a子菜单时,主项目不再悬停,子菜单

消失了。见
http://www.tc3.edu /instruct/sbrown/n...s/indexbad.htm


我确定有关于sub-br的尺寸或位置的信息。 />
菜单(内部UL)没有在prodrop4中明确指定,

但是在使用Mozilla DOM检查员几个小时之后我还没有

能够找到它。


有人可以指出我错过了什么吗?谢谢!



我通过系统地删除我自己的CSS

块来解决这个问题,直到意外行为消失为止。这是一份声明

表{margin-top:1em}


-

Stan Brown,Oak Road Systems,Tompkins美国纽约郡
http://OakRoadSystems.com/

HTML 4.01规范: http://www.w3.org/ TR / html401 /

验证人: http:// validator .w3.org /

CSS 2.1规范: http://www.w3.org/TR/CSS21/

验证人: http://jigsaw.w3.org/css-validator/

为什么我们不能帮助你:
http://diveintomark.org/archives/200..._wont_help_you

Stan Brown写道:


>

有人可以指出我错过了什么吗?谢谢!



嗨斯坦,


我没有在这里声称任何伟大的专业知识,因为

当我几个月前完成这个练习时,我很快发现了

,用CSS你无法真正计算出会发生什么,

你只需要在尽可能多的浏览器中试用它,并尝试使用
来修复损坏的位(FF对我来说是最好的起点)。这是通过反复试验来编码的 - 这意味着基本上都在做实验。

无论如何我现在已经忘记了我学到的大部分内容。


所以我只是快速浏览了你的CSS。我注意到身体样式

有一些填充,它会级联到其他对象。由于旧的IE版本的IE有内置的盒子模型,你可能会看到一些

的效果。您可能希望尝试将其归零,如果

菜单使用了必须将填充归零的元素。


Sun, 2008年8月3日08:35:04来自David Morris的+0800

< dl ************** @ netwizDONTSPAM.com.au>:


我注意到身体样式

有一些填充,它会级联到其他对象。由于旧的IE版本的IE有内置的盒子模型,你可能会看到一些

的效果。您可能希望尝试将其归零,并且如果

菜单使用标识符需要将填充归零的元素。



感谢大卫。我想我7月29日的文章从来没有到达你的网站。正如我所报告的那样,我通过划分 - b $ b&b&conquer策略解决了这个问题。工作代码现在在
http://www.tc3 .edu / instruct / sbrown / stat5808b /

在Lynx中,菜单显示为嵌套列表,这似乎是优雅的

降级。


-

Stan Brown,Oak Road Systems,美国纽约汤普金斯县
http://OakRoadSystems.com/

HTML 4.01规范: http://www.w3.org/TR/html401/

验证人:< a rel =nofollowhref =http://validator.w3.org/\"target =_ blank> http://validator.w3.org/

CSS 2.1规范: http://www.w3.org/TR/CSS21/

验证人: http://jigsaw.w3。组织/ CSS-验证/

为什么我们不能帮助你:
http://diveintomark.org/archives/200..._wont_help_you


As usual, it looks right in Firefox 3 but not in IE6.

See http://www.tc3.edu/instruct/sbrown/n.../indexgood.htm
for the desired behavior -- when you hover over the second or third
main menu item, a submenu appears and an item can be selected. (The
links don''t go anywhere.) This works in FF and IE.
The style sheet is
http://www.tc3.edu/instruct/sbrown/prodrop4.css

But when I include my own style sheet
http://www.tc3.edu/instruct/sbrown/screen.css
in addition to prodrop4.css, then FF still works but IE now has a gap
between the main line and the sub-menus, so when you try to mouse to
a sub-menu the main item is no longer hovered and the sub-menu
disappears. See
http://www.tc3.edu/instruct/sbrown/n...s/indexbad.htm

I''m sure there''s something about sizing or positioning of the sub-
menus (the inner ULs) isn''t being explicitly specified in prodrop4,
but after a couple of hours with the Mozilla DOM inspector I haven''t
been able to find it.

Can someone point out what I''m missing? Thanks!
--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won''t Help You:
http://diveintomark.org/archives/200..._wont_help_you

解决方案

Sun, 27 Jul 2008 16:07:39 -0400 from Stan Brown
<th************@fastmail.fm>:

But when I include my own style sheet
http://www.tc3.edu/instruct/sbrown/screen.css
in addition to prodrop4.css, then FF still works but IE now has a gap
between the main line and the sub-menus, so when you try to mouse to
a sub-menu the main item is no longer hovered and the sub-menu
disappears. See
http://www.tc3.edu/instruct/sbrown/n...s/indexbad.htm

I''m sure there''s something about sizing or positioning of the sub-
menus (the inner ULs) isn''t being explicitly specified in prodrop4,
but after a couple of hours with the Mozilla DOM inspector I haven''t
been able to find it.

Can someone point out what I''m missing? Thanks!

I figured it out by systematically removing chunks of my own CSS
until the undesired behavior disappeared. It was a declaration
table { margin-top: 1em }

--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won''t Help You:
http://diveintomark.org/archives/200..._wont_help_you


Stan Brown wrote:

>
Can someone point out what I''m missing? Thanks!

Hi Stan,

I am not claiming any great expertise here, as much as anything because
when I went through this exercise a few months back I quickly discovered
that with CSS you couldn''t really calculate what was going to happen,
you just had to try it out in as many browsers as possible, and attempt
to fix the broken bits (FF for me was the best starting point). It is
coding by trial and error - which means basically doing experiments.
And in any case I have now forgotten most of what I learnt.

So I have only quickly skimmed your CSS. I noticed that the body style
has some padding which will cascade down to other objects. Since older
version of IE had the box model inside out, you may be seeing some
effects of that. You might want to try zeroing that out, and if the
menu works identity the elements that need to have the padding zeroed.


Sun, 03 Aug 2008 08:35:04 +0800 from David Morris
<dl**************@netwizDONTSPAM.com.au>:

I noticed that the body style
has some padding which will cascade down to other objects. Since older
version of IE had the box model inside out, you may be seeing some
effects of that. You might want to try zeroing that out, and if the
menu works identity the elements that need to have the padding zeroed.

Thanks for the thought, David. I guess my article of 29 July never
reached your site. As I reported, I solved the problem by a divide-
and-conquer strategy. The working code is now at
http://www.tc3.edu/instruct/sbrown/stat5808b/

In Lynx, the menus show as nested lists, which seems to be a graceful
degradation.

--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won''t Help You:
http://diveintomark.org/archives/200..._wont_help_you


这篇关于菜单中级联的问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆