Браузер Opera: витать странно - PullRequest
Новая
       5

Браузер Opera: витать странно

1 голос
/ 24 июня 2010

Я занимаюсь разработкой сайта последние пару дней, и все работает нормально во всех основных браузерах, кроме Opera.По какой-то неизвестной причине навигация не вернется к display:none;, когда я выйду из выпадающего меню.

Если есть какой-то трюк, о котором я не знаю, пожалуйста, сообщите мне.

URL проблемы:http://demo.ivannovak.com/iocaste/index.html

Опять же, все хорошо в FF, Chrome, Safari и IE7 +.Эта проблема характерна для Opera.

Соответствующий HTML: 

            <ul id="navigation">
                <li class="active"><a href="index.html">Home</a></li>
                <li><a href="about.html">About</a></li>
                <li>
                    <a href="page.html">Example Set</a>
                    <ul>
                        <li><a href="full-width.html">Full-Width Page</a></li>
                        <li><a href="html-test.html">HTML Test</a></li>
                        <li><a href="page.html">Normal Page</a></li>
                        <li>
                            <a href="page.html">GrandChild Nav</a>
                            <ul>
                                <li><a href="page.html">Normal Page</a></li>
                                <li><a href="page.html">Normal Page</a></li>
                                <li><a href="page.html">Normal Page</a></li>
                            </ul>
                        </li>
                        <li><a href="contact.html">Normal Page</a></li>
                    </ul>
                </li>
                <li><a href="blog.html">Blog</a></li>
                <li><a href="portfolio.html">Portfolio</a></li>
                <li><a href="contact.html">Contact</a></li>
            </ul><!-- #navigation -->

Соответствующий CSS: 

#navigation {
    float:right;
    position:relative;
    top:35px;
    z-index:10;
    margin-right:10px;
    list-style: none;
}

#navigation li {
    float:left;
    position:relative;
    margin:0;
    padding:0;
}

#navigation li.active > a,
#navigation li a:hover {
    color:#e5e5e5;
}

#navigation li a {
    color:#b2b2b2;
    text-decoration:none;
    padding:5px 12px;
}

#navigation li ul {
    display:none;
    position:absolute;
    text-align:center;
    z-index:3;
    left:50%;
    margin:0 0 0 -104px;
    padding-bottom:10px;
    top:100%;
    list-style: none;
}

#navigation li:hover ul {
    display:block;
}

#navigation li ul li {
    width:178px;
    text-align:center;
    padding:0 15px;
    float:none;
}

#navigation > li > ul > li:first-child {
    background:url(../img/child_nav_top.png) no-repeat 50% 0 transparent;
    padding-top:20px;
}

#navigation > li > ul > li {
    background:url(../img/child_nav_repeat.png) repeat-y 50% 0 transparent;
}

#navigation > li > ul > li:last-child {
    background:url(../img/child_nav_bottom.png) no-repeat 50% 100% transparent;
    padding-bottom:20px!important;
}

#navigation li.lastChild {


/*  IE 8 is dumb */
    background:url(../img/child_nav_bottom.png) no-repeat 50% 100% transparent;
    padding-bottom:20px!important;
}

#navigation li ul li ul {
    position:absolute;
    display:none!important;
    z-index:4;
    left:278px;
    top:-15px;
}

#navigation li ul li:hover ul {
    display:block!important;
}

#navigation li ul li ul li {
    float:none;
    width:119px;
    text-align:center;
    padding:0 8px 0 15px;
}

#navigation > li > ul > li > ul > li:first-child {
    background:url(../img/grandChild_nav_top.png) no-repeat 50% 0 transparent;
    padding-top:15px;
}

#navigation > li > ul > li > ul > li {
    background:url(../img/grandChild_nav_repeat.png) repeat-y 50% 0 transparent;
}

#navigation > li > ul > li > ul > li:last-child {
    background:url(../img/grandChild_nav_bottom.png) no-repeat 50% 100% transparent;
    padding-bottom:20px;
}

#navigation li.lastGrandChild {
    background:url(../img/grandChild_nav_bottom.png) no-repeat 50% 100% transparent;
    padding-bottom:20px;
}

1 Ответ

0 голосов
/ 28 июня 2010

Кажется, это была ошибка перерисовки, которая была исправлена ​​в более поздних выпусках.

...