Tesseract Themenmenü

Question

Ich bin neu in diesem Forum also Hallo an alle.

Ich arbeite an einem WordPress-Website-Thema namens Tesseract. Ich bin neu in WordPress und habe daher nur begrenzte Erfahrung damit.

Das Problem, das ich erfahre, ist mit dem Menü oben auf der Seite. Wenn Sie www.avoinvents.co.uk besuchen und einen Blick darauf werfen, werden Sie sehen, dass die Kategorien nicht in derselben Zeile stehen. Wenn ich eine der Kategorien entferne, sieht die Seite viel schöner und sauberer aus. Alle Kategorien sind notwendig, daher konnte ich keine löschen.

Könnte jemand hier vorschlagen, wie ich die notwendigen Änderungen vornehmen, um das Menü zu beheben.

Vielen Dank

Answer 1

Hier ist die CSS, die ich in meinem Browser geändert, um das Menü in allen einer Zeile erscheinen:

#masthead { 
padding-top: 10px; 
padding-bottom: 10px; 
} 

#site-banner-left { 
width: 100%; 
} 

Das Hauptproblem war, dass die Website-Banner-Links-CSS-Definition hatte eine Breite von 60%, wodurch der Text um seinen Rand gewickelt wird, also änderte ich seine Breite auf 100% und fügte das Padding hinzu, um den Navigationsbereich ein wenig größer zu machen. Wenn dies mit anderen Teilen des Themas verwechselt wird, versuchen Sie, die Textgröße der Site-Banner-Links-Definition kleiner zu machen, anstatt ihre Breite zu ändern. Hoffe das hilft.

Answer 2

Sie haben die verfügbare Breite begrenzt, da ein Vorfahrelement #site-banner-left eine Breite von 60% hat. Erhöhen Sie diesen Wert oder entfernen Sie diese Regel, damit das gesamte Menü auf natürliche Weise angepasst werden kann.

Darüber hinaus, da die Menüpunkte sind inline-block Elemente, Sie können sie zwingen, auf einer Linie zu sein, indem das übergeordnete Element des white-space-nowrap:

.nav-menu { 
    white-space: nowrap; 
}