3

こんにちは私は誰かが私がSafariで抱えている問題で私を助けてくれるかどうかを望んでいました。基本的に私はウェブサイトを作成しました

ナビゲーションバーのトップメニューを見ると、Google Chrome、IE、Firefox、Operaには単語と文字の間隔があります。ただし、SafariでこのWebサイトを開く場合、単語の間隔はありません。

これがコードのコピーであり、下部に貼り付けられています。

    <nav id="top_menu">
        <ul>
            <li><a href="home.html">Home</a></li>
            <li><a href="services.html">Services</a></li>
            <li><a href="destination.html">Destinations</a></li>
            <li><a href="products.html">Products</a></li>
            <li><a href="contact.html">Contact</a></li>
       </ul>
    </nav>

そして、これがこのコードのCSSです。

#top_menu {
        margin-left:170px;
        letter-spacing:1px;
        word-spacing:50px;
}

#top_menu li {
    display:inline-block;
    list-style:none;
    padding:5px;
    font:bold 14px Tahoma, Geneva, sans-serif;
    position:relative;
    bottom:40px;
}

#top_menu li a { 
    border-bottom: none; 
}

#top_menu a {
    color:#FFF;
    text-decoration: none; 
    border-bottom: 1px solid #7ac000; 
    padding-bottom: 2px; 
}

#top_menu a:hover { 
    color: #ff5400; 
    text-decoration: none; 
    border-bottom: 1px solid #ff5400; 
    padding-bottom: 2px; 
}

#top_menu a:active { 
    color: #ff5400; 
    text-decoration: none; 
    border-bottom: 1px solid #ff5400; 
    padding-bottom: 2px; 
    position: relative; top: 1px; 
}
4

2 に答える 2

0

こんにちは、あなたが使用する目的が何であるかを気にしない場合、アイデアが2つの使用word-spacing:50px;の間にスペースを確保することであり、<a>paddingliword-spacing#top_menu 

#top_menu {
        margin-left:170px;
        letter-spacing:1px;
}

#top_menu li {
    display:inline-block;
    list-style:none;
    padding:5px 15px 5px 0;
    font:bold 14px Tahoma, Geneva, sans-serif;
    position:relative;
    bottom:40px;
}

これが完璧な答えではないことはわかっていますが、うまくいけばこれがあなたの助けになるでしょう....

于 2013-03-18T07:31:24.957 に答える