0

你可以在这里看到我目前正在工作的网站。
我知道,这是非常老式的,但我的客户是这样设计的,我只是按照他想要的方式实现它......别担心,你不会看太久的!
问题是,当鼠标悬停在 Internet Explorer 7(仅 7)中时,顶部的导航栏消失了……
确实,除了第一个元素之外的所有元素都消失了。出于某种原因,第一个仍然存在......我无法获得任何关于正在发生的事情的线索,我确信我应该使用某种 css 技巧!
所以这里是我的css(只有一个与导航栏相关的)。

/*Relevant part*/
.navigation-menu-wrapper {
    height: 143px;
    max-height: 143px;
    width: 829px;
}

.navigation-menu {
    list-style: none;
}

.navigation-menu-item {
    float: left;
    background-color: rgba(255, 255, 255, 0.6);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#99FFFFFF', endColorstr='#99FFFFFF'); /*IE 7/8 fix for rgba*/
    width: 163px;
    height: 143px;
    max-height: 143px;
    font-family: "Times New Roman";
    color: #000000;
    text-transform: uppercase;
    font-size: 24px;
    line-height: 143px;
    border: 1px solid #000000;
    margin: 0;
    padding:0;
}

.navigation-menu-item-selected {
    background-color: rgba(255, 255, 255, 1);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#FFFFFFFF', endColorstr='#FFFFFFFF'); /*IE 7/8 fix for rgba*/
}


/*End relevant part*/
/*Page CSS, just in case you need it*/

.page-wrapper {
    width: 1024px;
    height: 100%;
    max-height: 100%;
    min-height: 768px;
}

.center-content-wrapper {
    width: 824px;
    min-height: 768px;
    background-image: url("../../img/background.jpg");
    background-repeat: no-repeat;
}

.main-content-wrapper {
    width: 100%;
    min-height: 623px;
    max-height: 623px;
}

.main-content-overlay {
    margin: 25px;
    padding-left: 70px;
    padding-right: 70px;
    padding-top: 20px;
    background-color: rgba(0, 0, 0, 0.85);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#d8000000', endColorstr='#d8000000');
    min-height: 509px;
    max-height: 509px;
    height: 509px;
    overflow-y: auto;
    font-size: 14px;
    font-family: "Times New Roman";
}

你能建议一个修复吗?即使是肮脏的把戏也将不胜感激!
谢谢!

4

2 回答 2

1

这是因为您将您<a>的列表项包裹起来......它应该是相反的方式。环绕你<li><a>

所以像这样作为一个例子:

<ul class="navigation-menu no-margin no-padding">
 <li class="navigation-menu-item single-line"><a class="navigation-menu-item navigation-
 menu-item-selected link-no-decoration" href="index.php">L'attivitá</a>
 </li>  

它以这种方式工作.. 对你所有的人都做同样的事情<li>,它会在 IE7 中工作

于 2013-02-27T13:57:58.817 回答
1

你的标记搞砸了。

<ul class="navigation-menu no-margin no-padding">
    <a class="navigation-menu-item navigation-menu-item-selected link-no-decoration" href="index.php">
        <li class="navigation-menu-item single-line">L'at (...)

在此上下文中,元素 a 不允许作为元素 ul 的子元素。

于 2013-02-27T13:58:06.507 回答