0

<div>こんにちは、私のメニュー バーは、別のブラウザーで私の領域に収まりません。Opera と Chrome では問題ないように見えますが、Explorer と Firefox ではメニューが収まりません。

そして、私のメニューはこの<div>タグにあります：

.page {
     width: 964px;
    margin-left: auto;
    margin-right: auto;
    background-image:url(../images2/images/orta_alan_bg_GOLGE.png);
    background-repeat:repeat-y;
}

ここに私のメニューがあります：

ul#menu {       
    padding: 0 0 2px;
    position: relative;
    margin: 0;
    text-align: center;       
}

ul#menu li {
    display: inline;
    list-style: none;
    font-family: 'Museo300Regular';
    font-size:17px;
    font-style:normal;        
}
ul#menu li a 
{        
    background-image:url(../../images2/images/menu_bg_normal.jpg); 
    background-repeat: repeat;
    padding: 5px 19px 5px;        
    font-weight: normal;
    text-decoration: none;
    line-height: 2.8em;
    background-color: #e8eef4;
    color: #FEFEFF;
    border-radius: 4px 4px 0 0;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
      cursor:pointer;          
}

では、Explorer や Firefox に適合しない問題は何でしょうか?

私が言いたいことを理解できる画像を添付します

ここに画像の説明を入力

これが適合するChromeとOperaです

ここに画像の説明を入力

4

2 に答える 2

3

テキストは、異なるブラウザーでは常に異なるスペースを占有します (異なるコンピューターの同じブラウザーでも)。

したがって、メニューを正確に合わせたい場合は、ボタンの幅をボタン内のテキストに直接基づいて設定することはできません。すべてのボタンを同じ幅にするか、ボタンごとに正確な幅を指定してください。

または、コンテンツに基づいてセル間のスペースを分割できるテーブルを使用することに頼ります。

于 2012-09-29T09:31:22.110 に答える
1

CSSコードをリセットすることで実現できます。次にul li、リスト項目のスタイルを設定するために使用します。
必要に応じて、条件付きコメントを使用して、何らかのバグ修正を含む IE 用のスタイルシートを読み込むことができます。

しかし、通常、li要素のすべてのブラウザで100％正確な結果を達成できるため、証明されています。

于 2012-09-29T09:41:29.840 に答える