在我当前的站点中,我正在使用新的Jscrollpane来为菜单生成滚动条(不是我的决定,而是设计师的决定,所以我不想进入 90 年代的样子……)。
我的菜单基于其中<UL>
的<li>
元素具有属性“text-align:right;”。
我的问题是,当我将 ScrollPane 应用于菜单时,仅在 IE 上菜单文本不显示。当我从我的代码中删除 ScrollPane 功能时,菜单会重新出现。
我使用“microsoft Expression”DOM 检查器检查了该页面,以检查 IE 如何查看我的代码并且我可以看到<li>
那里的元素,只有其中的文本丢失了。当我禁用“文本对齐:右;” 在<li>
我的 CSS 中,文本再次显示。我怀疑这与相对对齐的 jScrollPane 包含有关,但我不能确定..
谁能建议一些解决这个问题的方法?
可以看到问题的页面的链接在这里: http: //kaplanoland.com/index.php ?option=com_content&view=article&id=2&Itemid=12
有问题的菜单位于页面的右侧。在除 IE 之外的所有浏览器上,您都可以看到文本。只在 IE 上不行。我的那个菜单的 CSS 代码(不包括 jScrollPane CSS)在这里:
div#menu2{
position: absolute;
top: 123px;
right: 36px;
width: 330px;
height: 150px;
}
div#menu2_scroll{ /*the actual scroller*/
height: 150px;
}
div#menu2 div#menu2_contain{
}
div#menu2 li{
text-align: right;
}
div#menu2 li span{
line-height: 18px;
}
div#menu2 a:link,
div#menu2 a:visited{
color: #808285 ;
font-family: Arial, Helvetica, sans-serif ;
font-size: 12px ;
}
div#menu2 a:hover,
div#menu2 li#current a{
color: #000000 ;
font-family: Arial, Helvetica, sans-serif ;
font-size: 12px ;
}
div#menu2 span.separator{
display: block;
padding-top: 12px;
padding-bottom: 40px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #000000;
}
div#menu2 span.separator span {
padding-top: 12px;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #808285;
}