卧式。 IE中的导航ul问题 [英] Horiz. navigation ul problem in IE

问题描述

大家好。


首先必要的链接：


网站： http://www.joshrenaud.com/bodies/index.html

css： http://www.joshrenaud.com/bodies/stylesheets/style.css


我有一个UL用于网站上的水平导航栏。它在我检查过的大多数浏览器中看起来都是不错的，除了IE5。


在IE5中，链接断开并换行到第二行。但是

第二行的链接与上面的链接重叠。


在可能是相关的问题中，我也注意到导航

bar似乎浮动得太高，触及页面顶部。其他浏览器

（Safari，Netscape等）不这样做。导航栏上没有设置边距

本身（#MainContent ul＃Menu），但在父div（#MainContent）上。


可以有人建议解决这两个问题的解决方案（或两个解决方案吗？

他们两个？）


感谢任何人提供的任何帮助。


--Josh

Hey everyone.

First the requisite links:

site: http://www.joshrenaud.com/bodies/index.html
css: http://www.joshrenaud.com/bodies/stylesheets/style.css

I have a UL that I''m using for a horizontal navigation bar on a website. It
looks decent in most browsers I''ve checked, except for IE5.

In IE5, the links break and wrap onto a second line. But the links on the
second line overlap the upper ones.

In what is probably a related problem, I''ve also noticed that the navigation
bar seems to float up too high, touching the top of the page. Other browsers
(Safari, Netscape, etc) don''t do this. The margin isn''t set on the nav bar
itself (#MainContent ul#Menu) but on the parent div (#MainContent).

Can anyone suggest solutions to either of these problems (or a solution for
them both?)

Thanks for any help anyone can offer.

--Josh

推荐答案

Josh Renaud写道：

Josh Renaud wrote:

嘿大家。

首先必要的链接：

网站： http://www.joshrenaud.com/bodies/index.html
css： http://www.joshrenaud.com/bodies/stylesheets/style.css

是的，但是这不是你唯一的风格。你可能通过提及给我节省了很多时间

http://www.joshrenaud.com/bodies/sty...ts/styleNN.css

有什么我的意思不太明白。来自style.css：


* html div＃LeftSidebar {

position：absolute; / *属性为IE5.x / PC * /

p\osition：absolute; IE5 / PC的属性/ IE5 / Mac * /

}


我看不到它的成就。您已在

属性中设置了相同的值。你为什么需要它们？你还在

sytleNN.css中设置了这个值。


div＃LeftSidebar {

position：fixed; / *其他浏览器的属性* /

}


这在符合浏览器方面无效。因为


* html div＃LeftSidebar


的重量大于


div＃LeftSidebar


将始终使用第一个选择器的值。如果你想要一些

浏览器使用position：fixed，你需要更改css。


#MainContent ul＃Menu li a：link {color： ＃933; }

#MainContent ul＃Menu li a：visited {color：＃933; }


注意：您应该始终在每个特定级别设置颜色和背景颜色（或设置

）。

我有一个UL用于网站上的水平导航栏。它在我检查过的大多数浏览器中看起来都不错，除了IE5。

在IE5中，链接断开并换行到第二行。但是第二行的链接与上面的链接重叠。


同样适用于IE 5.5 / Win。 :(我无法通过在代码中查看

来弄清楚什么是错的。我会承认我很难处理2

样式表因为它们有很多重叠的材料。


#MainContent {

宽度：460px;


呃！宽度以像素为单位固定。这是不好的做法。我想在更宽的宽度上测试

IE / Win，但内容的固定宽度使得除了

之外都不可能。改变宽度为em单位。找到一个近似值为
的值。然后，增加宽度，看看是否会改变菜单的

行为。 />

其他问题。


我查看了HTML。你为什么要使用任何定位？它看起来好像

就像你可以简单地将侧边栏浮动一样.BTW，


< img src =" graphics / logo.gif" alt =" logo" />


alt =" logo"对Googlebot不起作用，也不对文本浏览器有帮助。 alt

应为空（但不能删除）。


< img src =" graphics / logo.gif" ALT ="" />


在同一主题上，教师的照片缺少alt

属性。添加alt =""标签。

在可能是一个相关的问题中，我还注意到导航
栏似乎浮动得太高，触及页面顶部。

Hey everyone.

First the requisite links:

site: http://www.joshrenaud.com/bodies/index.html
css: http://www.joshrenaud.com/bodies/stylesheets/style.css
Yes, but that''s not your only style. You might have saved me a lot of
time by mentioning

http://www.joshrenaud.com/bodies/sty...ts/styleNN.css
There''s something I don''t quite get. From style.css:

* html div#LeftSidebar {
position: absolute; /* property for IE5.x/PC */
p\osition: absolute; /* property for IE6/PC, IE5/Mac */
}

I don''t see what that accomplishes. You''ve set the same value in both
properties. Why do you need them both? And you also set that value in
sytleNN.css.

div#LeftSidebar {
position: fixed; /* property for other browsers */
}

This will do nothing in conforming browsers. Because

* html div#LeftSidebar

has greater weight than

div#LeftSidebar

the value for the first selector will always be used. If you want some
browsers to use position: fixed, you need to change the css.

#MainContent ul#Menu li a:link { color: #933; }
#MainContent ul#Menu li a:visited { color: #933; }

NB: You should always set both color and background color (or set
neither) at every level of specificity.
I have a UL that I''m using for a horizontal navigation bar on a website. It
looks decent in most browsers I''ve checked, except for IE5.

In IE5, the links break and wrap onto a second line. But the links on the
second line overlap the upper ones.
Ditto for IE 5.5/Win. :( I cannot figure out what''s wrong by looking
at the code. I''ll confess I''m having a hard time processing the 2
stylesheets because they have so much overlapping material.

#MainContent {
width: 460px;

Ugh! Width fixed in pixels. This is bad practice. I wanted to test
IE/Win at wider widths, but the fixed width of content made that all but
impossible. Change the width to em units. Find a value that approximates
what you have now. Then, increase the width, and see if that changes the
behavior of the menu.

Other issues.

I looked at the HTML. Why do you use any positioning at all? It looks
like you can simply float the sidebar left. BTW,

<img src="graphics/logo.gif" alt="logo" />

alt="logo" does not help Googlebot much, nor a text browser. The alt
should be empty (but not removed).

<img src="graphics/logo.gif" alt="" />

On the same topic, your photo of the instructor is missing the alt
attribute. Add alt="" to the tag.
In what is probably a related problem, I''ve also noticed that the navigation
bar seems to float up too high, touching the top of the page.

这一个让我难以理解。如果我把它想出来，我会再次回复

out，但你可能想在继续之前简化你的事情。


-

Brian（从我的地址中删除无效给我发电子邮件）
http://www.tsmchughs.com/

Josh Renaud写道：

Josh Renaud wrote:

大家好。
网站： http://www.joshrenaud.com/bodies/index.html
css： http://www.joshrenaud.com/bodies/stylesheets/style.css

是的，但那不是你的只有风格。你可能通过提及给我节省了很多时间

http://www.joshrenaud.com/bodies/sty...ts/styleNN.css

有什么我的意思不太明白。来自style.css：


* html div＃LeftSidebar {

position：absolute; / *属性为IE5.x / PC * /

p\osition：absolute; IE5 / PC的属性/ IE5 / Mac * /

}


我看不到它的成就。您已在

属性中设置了相同的值。你为什么需要它们？你还在

sytleNN.css中设置了这个值。


div＃LeftSidebar {

position：fixed; / *其他浏览器的属性* /

}


这在符合浏览器方面无效。因为


* html div＃LeftSidebar


的重量大于


div＃LeftSidebar


将始终使用第一个选择器的值。如果你想要一些

浏览器使用position：fixed，你需要更改css。


#MainContent ul＃Menu li a：link {color： ＃933; }

#MainContent ul＃Menu li a：visited {color：＃933; }


注意：您应该始终在每个特定级别设置颜色和背景颜色（或设置

）。

我有一个UL用于网站上的水平导航栏。它在我检查过的大多数浏览器中看起来都不错，除了IE5。

在IE5中，链接断开并换行到第二行。但是第二行的链接与上面的链接重叠。


同样适用于IE 5.5 / Win。 :(我无法通过在代码中查看

来弄清楚什么是错的。我会承认我很难处理2

样式表因为它们有很多重叠的材料。


#MainContent {

宽度：460px;


呃！宽度以像素为单位固定。这是不好的做法。我想在更宽的宽度上测试

IE / Win，但内容的固定宽度使得除了

之外都不可能。改变宽度为em单位。找到一个近似值为
的值。然后，增加宽度，看看是否会改变菜单的

行为。 />

其他问题。


我查看了HTML。你为什么要使用任何定位？它看起来好像

就像你可以简单地将侧边栏浮动一样.BTW，


< img src =" graphics / logo.gif" alt =" logo" />


alt =" logo"对Googlebot不起作用，也不对文本浏览器有帮助。 alt

应为空（但不能删除）。


< img src =" graphics / logo.gif" ALT ="" />


在同一主题上，教师的照片缺少alt

属性。添加alt =""标签。

在可能是一个相关的问题中，我还注意到导航
栏似乎浮动得太高，触及页面顶部。

Hey everyone.

First the requisite links:

site: http://www.joshrenaud.com/bodies/index.html
css: http://www.joshrenaud.com/bodies/stylesheets/style.css
Yes, but that''s not your only style. You might have saved me a lot of
time by mentioning

http://www.joshrenaud.com/bodies/sty...ts/styleNN.css
There''s something I don''t quite get. From style.css:

* html div#LeftSidebar {
position: absolute; /* property for IE5.x/PC */
p\osition: absolute; /* property for IE6/PC, IE5/Mac */
}

I don''t see what that accomplishes. You''ve set the same value in both
properties. Why do you need them both? And you also set that value in
sytleNN.css.

div#LeftSidebar {
position: fixed; /* property for other browsers */
}

This will do nothing in conforming browsers. Because

* html div#LeftSidebar

has greater weight than

div#LeftSidebar

the value for the first selector will always be used. If you want some
browsers to use position: fixed, you need to change the css.

#MainContent ul#Menu li a:link { color: #933; }
#MainContent ul#Menu li a:visited { color: #933; }

NB: You should always set both color and background color (or set
neither) at every level of specificity.
I have a UL that I''m using for a horizontal navigation bar on a website. It
looks decent in most browsers I''ve checked, except for IE5.

In IE5, the links break and wrap onto a second line. But the links on the
second line overlap the upper ones.
Ditto for IE 5.5/Win. :( I cannot figure out what''s wrong by looking
at the code. I''ll confess I''m having a hard time processing the 2
stylesheets because they have so much overlapping material.

#MainContent {
width: 460px;

Ugh! Width fixed in pixels. This is bad practice. I wanted to test
IE/Win at wider widths, but the fixed width of content made that all but
impossible. Change the width to em units. Find a value that approximates
what you have now. Then, increase the width, and see if that changes the
behavior of the menu.

Other issues.

I looked at the HTML. Why do you use any positioning at all? It looks
like you can simply float the sidebar left. BTW,

<img src="graphics/logo.gif" alt="logo" />

alt="logo" does not help Googlebot much, nor a text browser. The alt
should be empty (but not removed).

<img src="graphics/logo.gif" alt="" />

On the same topic, your photo of the instructor is missing the alt
attribute. Add alt="" to the tag.
In what is probably a related problem, I''ve also noticed that the navigation
bar seems to float up too high, touching the top of the page.

这一个让我难以理解。如果我把它想出来，我会再次回复

out，但你可能想在继续之前简化你的事情。


-

Brian（从我的地址中删除无效给我发电子邮件）
http://www.tsmchughs.com/

2004年4月17日星期六14:05:32 -0400，Brian

< us ***** @ julietremblay.com.invalid>写道：

On Sat, 17 Apr 2004 14:05:32 -0400, Brian
<us*****@julietremblay.com.invalid> wrote:

（引用CSS）

* html div＃LeftSidebar {

(quoted CSS)

* html div#LeftSidebar {

道歉，如果我是离开的时候，如果我的话，我可以自由地打击我，但这是否有意义？如果html是任何元素的后代，如果它是html的后代，我读这个就是选择id''ed div。但是html，作为根元素的
，永远不是任何元素的后代。这应该是合法的吗？

Apologies if I''m way off, and feel free to dope-slap me if I am, but does
this make sense? I read this as selecting the id''ed div if it is a
descendant of html if html is a descendant of any element. But html, being
the root element, is never a descendant of any element. Should this be
legal?

这篇关于卧式。 IE中的导航ul问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！