2017-07-17 6 views
0

Ich bin derzeit Anpassen von WordPress-Layout für ein Unternehmen und ich habe ein Problem mit dem Layout.Autoresize-Header in einer Zeile bleiben

Ich habe ein Logo in der Kopfzeile und rechts davon ist die Navigation. Aber wenn ich zoome, springt die Navigation an einer Stelle zur nächsten Reihe.

Ich möchte Sie fragen, wie ich sie beim Zoomen in einer Zeile halten soll.

Seite kann nach Antworten auf dev.machala.cz

Vielen Dank im Voraus zu finden.

+2

Bitte fügen Sie Ihren Code oder eine Demo hinzu, was Sie ausprobiert haben? – Jainam

+0

Es kann gesehen werden, gerade wie es auf dev.machala.cz ist und mit durch z. B. Mozzila-Konsole fiedled ... Es gibt eine Menge Code beteiligt. – Volt

Antwort

0

Wenn Sie Ihre Seite zoomen, bedeutet dies, dass die Ansichtsfenstergröße kleiner wird und Ihre Seite die Medienabfrage für diese Breite verwendet.

Wenn Sie Ihr Menü nicht nach unten brechen möchten. Sie müssen Ihre Medienabfrage entfernen.

Dies ist kein Problem. Sie können es so lassen wie es ist.

+0

Es ist OK, dass es in Dropdown für mobile Geräte geändert wird. Problem ist, dass auf 1200px Displaybreite sieht es ok aus, auf 1199px Top-Menü überspringt unter Logo, was nicht wünschenswert ist. Verwenden von Screenfly zum Testen. – Volt

+1

Sie müssen das Logo klein machen, und Sie können auch die linke und rechte Füllung Ihres Menüelements reduzieren. dafür, dass Sie eine Medienabfrage @media (max-width: 1199px) verwendet werden soll und (min-width: 992px) {// schreiben Sie Ihren Code hier } Sie verwenden Bootstrap die Breakpoint 1199px ist und es geht bis 992px. –

0

Wenn Sie versuchen, dies zu Layoutzwecken auf mobilen und Tablet zu tun, vielleicht ist dies berücksichtigen -

Probieren Sie die Schriftgröße des Menütext an sich ändernde:

font-size: 1vw;

und dann die Abfrage Medien ändern für die die mobilen Menü Toggle Leiste 1000px

und stellen Sie die Schriftgröße in dieser Medienabfrage wieder normal.

Mit VW skalieren Sie die Schrift mit der Breite des Browsers.

Dies bedeutet, dass Sie den Browser für etwas länger verkleinern können und dann die Medienabfrage für den Wechsel früher angezeigt wird, um zu vermeiden, dass der Text in eine neue Zeile verschoben wird.