css - Opera ブラウザは、オンラインとローカルで異なるメニュー (css) を表示します

Question

こちら側で多くの役立つヒントを読んだ後、私はここで私の問題に対する答えを見つけることができるという希望に満ちています. 私が取り組んでいる Web ページには、ボタンの背景画像を含む水平メニューが含まれています。検証後にブラウザでテストすると、FF、Chrome、および Opera で問題なく表示されます。アップロード後、オンラインの Opera ではボタンの一部が表示されないのに対し、他のブラウザでは違いがないことがわかりました。???? この問題についてのアイデアを事前にありがとう

Answer 1

上記のメールに加えて...試して、テストして、爪を噛んでいると、メニューの奇妙なレンダリングが5つのリンクのうち2つでのみ発生することがわかりました.1つは「commonmail.html」という名前で、もう1つは「 index.html". ファンタジーの名前を選択するか、単に href="#" と入力すると、css が適切にレンダリングされます。問題を示すために、2 つのスクリーンショットへのリンクを追加しました。

幻想的なリンク名のメニュー

通常のリンク名のメニュー

マークアップは次のとおりです。

    <ul>
    <li><a class="direkt" href="#">home</a></li>
    </ul>

    <ul>
    <li class="firstlevel">our houses

        <ul>
        <li><a href="nikiti_location.html">in nikiti</a></li>

        <li><a href="#">in kastri</a></li>

        <li><a href="#">new projects</a></li>
        </ul>

    </li>
    </ul>

    <ul>
    <li><a class="direkt" href="nikiti_info.html" title="Informations about Nikiti and the peninsula of Sithonia">nikiti</a></li>
    </ul>

    <ul>
    <li class="firstlevel">informations

        <ul>
        <li><a href="#" title="Read about our family business and our business philosophy">company</a></li>

        <li><a href="#" title="">buying property in greece</a></li>
        </ul>

    </li>
    </ul>

    <ul>
    <li><a class="direkt" href="commonmail.html" title="Informations about Nikiti and the peninsula of Sithonia">contact</a></li>
    </ul>       

</nav>

そしてcssはこれです：

nav {
width: 704px;
padding: 0 0 0 16px;
float: left;
}
nav ul {
float: left;
width: 138px;
list-style-type: none; 
}
nav li.firstlevel {
font-size: 93%;
    font-weight:bold;
text-align: center;
padding-top: 17px;
padding-bottom: 17px;
color: #fff;
border: 1px solid transparent; /*--erforderlich für IE 7--*/
background: url(../pic/button110.png) 50% 50% no-repeat;
} 
nav a {
text-decoration: none;
display: block;
font-size: 90%;
text-align: left;
padding-left: 6px;
padding-top: 6px;
padding-bottom: 6px;
background: url(../pic/sublistbg.png) 0 0 repeat-x;
color: #fff;
} 
nav a:hover {
color: #454545;
background: url(../pic/sublisthoverbg.png) 0 0 repeat-x;
} 
nav li {
position: relative;
} 
nav ul ul {
position: absolute; top:50px; left: 30px;
width: 170px;
z-index: 2;
display: none;
} 
nav ul li:hover ul {
display: block;
} 
nav ul  a.direkt:link {
font-size: 93%;
font-weight: bold;
padding-top: 17px;
padding-bottom: 17px;
padding-left: 0;
text-align: center;
color: #fff;
border: 1px solid transparent;
background: url(../pic/button110.png) 50% 50% no-repeat;
} 

nav ul a.direkt:hover {
color: #454545;
background: url(../pic/button110active.png) 50% 50% no-repeat;
border: 1px solid transparent;
}