Responsive Header wird größer als Bildschirm auf Handy

Question

Ich habe eine ziemlich geradlinige Header auf meiner Website, hier zu sehen: www.botlink.us. Es ist so konzipiert, dass es reaktionsschnell ist. Wenn ich die Breite der Seite reduziere, wird es zu einer anderen Kopfzeile mit einem Symbol auf der rechten Seite, das das Menü der Links verlässt. Auf meinem Desktop funktioniert es wunderbar. Reduzieren Sie die Breite der Seite, der Header ist kein Problem. Wenn ich jedoch auf ein mobiles Gerät umschalte, bleibt die Kopfbreite aus irgendeinem Grund bei 700 Pixel, egal was passiert. Irgendeine Idee bezüglich der Ursache?

(Ich werde dieses Beispiel mit den tatsächlichen Code verfeinern, wenn ich herausgefunden habe, was die genaue Ursache ist. Vorerst alle angezeigten Code verknüpft ist.)

Answer 1

In diesem Fall war die Frage, die weiter unten In meinem HTML hatte ich ein Element (ein div-Tag mit einem weißen Hintergrund, so dass es sich einmischte und schwer zu fangen war, da die Elemente innerhalb des div zusammen mit dem Rest der Seite verschoben wurden, als der Bildschirm verengt wurde), der breiter gesetzt wurde . Ich habe das Problem gefunden, indem ich meine CSS-Stylings nach der Zeichenfolge '700px' durchsucht habe, bei der es sich um die Breite handelte, an der die Kopfzeile klebte. Ich habe dann den Code gefunden und konnte die Breiten neu konfigurieren, um das Problem zu beheben.