2011-05-19 93 views
0

我设计了一个网站,它在所有浏览器,但IE浏览器工作正常,我已经使用模板导航栏,并把它作为我的导航栏通过我的网站的样式表,但是当我在互联网浏览器中查看父母的孩子元素出现在浏览器的左侧,到目前为止,他们离开了观众窗口。我试图摆弄CSS代码,但似乎没有任何工作,我试图改变位置,并摆脱位置绝对的导航栏编码,使元素出现在页面上,但他们都在这个地方。下拉导航不工作在IE

CSS:

/* The outermost container of the Menu Bar, an auto width box with no margin or padding */ 
ul.MenuBarHorizontal 
{ 
    margin: 0; 
    padding: 0; 
    list-style-type: none; 
    cursor: default; 
    width: auto; 
    color: #ed3694; 
    font-family: Arial, Helvetica, sans-serif; 
} 
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */ 
ul.MenuBarActive 
{ 
    z-index: 1000; 
} 
/* Menu item containers, position children relative to this container and are a fixed width */ 
ul.MenuBarHorizontal li 
{ 
    margin: 0.1em; 
    padding: 0; 
    list-style-type: none; 
    font-size: 100%; 
    position: relative; 
    text-align: center; 
    cursor: pointer; 
    width: 8.6em; 
    float: right; 
    visibility: visible; 
} 
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */ 
ul.MenuBarHorizontal ul 
{ 
    margin: 0.1; 
    padding: 0; 
    list-style-type: none; 
    font-size: 100%; 
    z-index: 1020; 
    cursor: default; 
    position: absolute; 
    width: 191px; 
    left: -1000px; 
    height: 111px; 
    visibility: visible; 
    top: 34px; 
    } 
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */ 
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible 
{ 
    left: -52px; 
    font-family: Arial, Helvetica, sans-serif; 

} 
/* Menu item containers are same fixed width as parent */ 
ul.MenuBarHorizontal ul li 
{ 
    width: 8.6em; 
} 
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */ 
ul.MenuBarHorizontal ul ul 
{ 
    position: absolute; 
    margin: -5% 0 0 95%; 
} 
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */ 
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible 
{ 
    left:auto; 
    top: 0; 
} 

网页,查看源代码:www.mopowered.co.uk

如果有人可以帮助我将非常感激。我只需要让它在IE中正常工作。

蔡健雅

+0

这将是伟大的,如果你可以把你的问题/示例/问题jsfiddle.net – 2011-05-19 11:33:06

+0

什么是jsfiddlenet? – Tanya 2011-05-19 12:03:55

回答

0

中即某种原因父liMenuBarItemIE类需要position:static。如果将其更改为position:relative,则会将内容移动到li元素之下(例如,不完全如ff,但要好得多,如果您不知道什么问题请告诉我)。

+0

嘿,有点不确定你的意思,你谈论的源代码或CSS。 – Tanya 2011-05-19 12:03:19

+0

@Tanya只有因为某种原因才有内联的CSS。这会产生问题 – Sotiris 2011-05-19 12:05:19

+0

好吧,所以如何解决这个问题,出于某种原因? – Tanya 2011-05-19 12:11:27

0

你使用的Spry Menu js库有很多问题(做一个快速的谷歌搜索)。也许你应该考虑使用别的东西。

但我可以通过评论/在SpryMenuBar.js删除了以下线得到快速和肮脏的修复

 if(Spry.is.ie) 
     { 
      this.addClassName(items[i], this.isieClass); 
      items[i].style.position = "static"; 
     } 

我不认为这是正确的解决方案,但它似乎工作在你的情况。