1

皆さん、こんばんは。

このウェブサイトにアクセスするのはこれが初めてなので、これが本当にひどい場合は申し訳ありません。

何よりもまず、ワードプレスで使用するように設計されたウェブサイトを持っています。私が抱えている問題は、上部の水平ナビゲーションを特定の方法で表示したいということですが、そのままにしておくと、現在のように見えます2列目にドロップダウン...悲しいです。

したがって、個々のボタンを小さくして中央に配置し、使用しているフォント (IMPACT) が視聴者にない場合でも、それらがどのように調整されるかを決定しました。ドロップダウンとは対照的に、中央に配置されます。

DAYS でこれを行う方法を見つけようとしましたが、何度も失敗しました。Firefox で「firebug」を使用してコードの変更をテストしていますが、これを機能させる方法が見つかりません。

ウェブページはhttp://www.crapcast.comで、コードはページの上部、ロゴの下にあります。ページの現在の使用法を満たすようにフォーマットされた現在の CSS を含めます (ただし、一部の古いブラウザーや電話ブラウザーでは二重の行が表示される傾向があります)。

#navigation {
float:left;
position:relative;
z-index:9999;
}
#navigation ul {
font-family:Impact,Charcoal,Times New Roman;
font-size:22px;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
}
#navigation li {
float:left;
position:relative;
}
#navigation li a {
float:left;
letter-spacing:2.45px;
padding:15px;
text-decoration:none;
}
#navigation .main_category {
background-position:center top;
background-repeat:no-repeat;
}
#navigation .active {
background-position:0 10px;
background-repeat:no-repeat;
}
#navigation li.current-menu-item, #navigation li.current-menu-ancestor, #navigation li.current-post-parent, #navigation li.current-menu-parent {
background-position:0 10px;
background-repeat:no-repeat;
}
#navigation ul li ul {
display:none;
left:0;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
position:absolute;
top:50px;
width:230px;
}
#navigation ul li ul li a {
padding:15px 0 15px 36px;
width:194px;
}
#navigation li a.odd {
background-position:18px 23px;
background-repeat:no-repeat;
text-transform:uppercase;
}
#navigation li a.even {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#212121 url(../images/navigation_dot.gif) no-repeat scroll 18px 23px;
}
#navigation li a.odd:hover, #navigation li a.even:hover {
background-position:18px 23px;
background-repeat:no-repeat;
4

2 に答える 2

0

IE6を含め、どのブラウザでも「2行」の問題は発生しません。

そして、あなたの訪問者があなたが使用している正確なフォントを確実に見られるようにしたいのなら、それはImpactまたはあらゆる種類の派手なフォントかもしれません。http://www.fontsquirrel.com/fontface/generatorを使用してみてください。

希望のフォントをアップロードし、キットをダウンロードして、非常に簡単な手順に従ってください（^ _ ^）

于 2011-01-05T10:06:31.293 に答える
0

あなたの問題はあなたのフォントに関連していると思います：

#navigation ul {
  font-family:Impact,Charcoal,Times New Roman;
  ...
}
...
...
#navigation li a {
  ...
  letter-spacing:2.45px;
  ...
}

フォントの幅を使用して、メニュー内のアイテムの幅を設定しています。そのため、システムに Impact フォントがない場合、項目の幅がさらに大きくなります。Impact フォントの各文字の幅は、そこに配置した他のフォントに比べてかなり狭くなっています。

同等の幅のフォントを試してみると、問題が解決すると確信しています。

iPhone では、おそらく Android だと思いますが、Impact フォントは見つかりません。

Impact の代わりにHelvetica、Arialを試して、文字間隔を2.0pxなどに変更します。

于 2011-01-05T09:59:29.533 に答える