2016-10-04 5 views
0

私は奇妙な問題があります。私はWordpressでBonesテーマを使用しており、ホームページメニューにスタイルを入れることを試みています。私は両方の中でそれを持ってWordpressの "display"プロパティに "-webkit-box"を適用しようとしています

.home ul#menu-pages { 
    display: -webkit-box; 
} 

://www.advanceditsolutions.net/nearitest/

私が使用しようとしているCSSはこれです:

サイトでは、XPは* hでありますメディアクエリセクション、最小幅:481、最小幅:768。私はメディアクエリーの範囲外でも試してみました。私はそれがなぜ拾われないのか理解できません。私はサイトでそれを検査し、どこに表示CSSが表示されますか。

ほとんどのブラウザでプレースメントがうまくいきますが、Chromeではすべての機能がアップされています。すべての

::傷ヘッド::

答えて

2

1)まず、あなただけの特定のブラウザ(S)上で動作するベンダープレフィックス-webkit-を使用しています。

2)値が正しいかどうか確認してください。 Here isdisplayプロパティのすべての可能な値のリスト。 その-webkit-boxは、displayに適用できる正しい値ですか?

CSSを適用したい、機能しない、より大きなコンテキストを共有する、スクリーンショットを表示して、達成したいことを正確に伝えるのではないかもしれません。

3)Chrome Dev Tools、Firebugなどのデベロッパーツールを使用して、スタイルの適用やテストに似ていますか?それは便利で何が間違っているのか把握しようとする時間を節約することができます...

+0

1)私はそれを意図していました。私はそれがクロームでのみ動作する必要があり、他のブラウザは正常です。 2)値は正しいので、ディスプレイで使用することができます。 お詫び申し上げます。私は、別のページへのリンクの1つをクリックするだけで、どのように表示されるべきかを確認することができました。私はそれが問題だったホームページのメニューだけであると指定しました。 3)これは私が-webkit-boxがうまく動作することを発見した方法です。 Chrome Dev Toolsの使用 –

+0

問題を実際に修正する方法についてのご意見はありますか? –

0

私はそれがmin-width:768メディアクエリ内で動作しているのがわかります。あなたは私が見ることができるものからスタイルシートに一度しか含まれていません。ここ

2つの重要な課題は以下のとおりです。 1)あなたは、セレクタの一環として「.home」を使用しましたので、このCSSが唯一のホーム・ページを対象とします。 2) '-webkit'ベンダープレフィックスを使用しているため、そのエンジンで動作し、そのプロパティをサポートしているブラウザでのみ動作します。私はこれに対してお勧めします。おそらくフレックス表示タイプを使用するほうが良いでしょう。

+0

Chromeに固有のベンダーですが、そうではありませんか? - ウェブキット、私は意味する。 あなたはそうです、私はこれをちょっと試してみるしかありませんでした。元のデザイナーはheader.phpファイルのホームページからメニューを削除していました。 !is_front_page()関数を取り出しても、メニューは正しく表示されませんでしたが、Chrome Dev Toolsを使用しても、 'display:-webkit-box;'を追加できました。 Chromeで問題を解決する他のブラウザはうまく動いていたようだ。 –

+0

もう一度自分のスタイルシートをチェックしました。私は両方のメディアのクエリでそれを持っていた。なぜそれが1つだけを示すのか分かりません。 –

+0

主要なブラウザの点では、ChromeとSafariです。 – partypete25

関連する問題