現在、ある会社のワードプレスレイアウトをカスタマイズしていますが、レイアウトに問題があります。1行に留まるためにヘッダーを自動サイズ調整する
私はヘッダーにロゴがあり、右側にはナビゲーションがあります。しかし、ズームインすると、ある時点でナビゲーションが次の行にスキップされます。
ズームするときにどのようにそれらを1つの行に保持する必要があるかお尋ねしたいと思います。
ページの答えを事前にdev.machala.cz
おかげで見つけることができます。
ページをズームすると、ビューポートのサイズが小さくなり、その幅のメディアクエリを使用してページが始まることを意味します。
メニューを中断したくない場合。メディアクエリを削除する必要があります。
これは問題ではありません。あなたはそれをそのまま残すことができます。
モバイルデバイスのドロップダウンに変更しても問題ありません。 問題は、1200pxのディスプレイの幅では、1199pxのトップメニューがロゴの下に表示されても問題ありません。これは望ましくありません。 テスト用にスクリーンフライを使用しています。 – Volt
ロゴを小さくしなければならず、メニュー項目の左と右のパディングを減らすこともできます。 （MIN-幅：992px）{ //ここに をあなたのコードを記述} あなたはブレークポイントが1199pxで、ブートストラップを使用している：あなたはメディアクエリ @media（1199px最大幅）を使用する必要があることを行うための それは992pxまでになります。 –
あなたは多分これを考慮して、モバイルやタブレット上でのレイアウトの目的のためにこれをやろうとしている場合 -
にメニューテキストのフォントサイズを変更してみてください：
フォントサイズ：1vw。その後、
と1000px
にモバイルメニューのトグルバーのためのメディアクエリを変更し、そのメディアクエリーに正常に戻ってフォントサイズを設定します。
VWを使用すると、フォントの縮尺がブラウザの幅になります。
これを行うと、ブラウザを少し長く縮めてから、新しい行に移動することを避けて、トグルのメディアクエリがすぐに表示されるようになります。
コードを追加して試してみてください。 – Jainam
これはdev.machala.cz上でどのように動作しているのか分かり、mozzilaコンソールなどで手がかりになっています。 多くのコードが含まれています。 – Volt