Ergebnis 1 bis 4 von 4

Thema: Contao Official Demo - Probleme mit mobiler Navigation

  1. #1
    Contao-Nutzer
    Registriert seit
    02.09.2009.
    Ort
    Düsseldorf
    Beiträge
    31

    Standard Contao Official Demo - Probleme mit mobiler Navigation

    Guten Tag zusammen,

    ich habe mir das Contao Official Demo Theme installiert. Dabei habe ich Schwierigkeiten mit der mobilen Navigation, nach Umstellung des 2-Spalten-Layout auf Hauptspalte und rechte Spalte, und gleichzeitigem Inhalt in der rechten Spalte. Dazu habe ich zum Testen ein Modul mit "eigenem HTML Code" erstellt, das außer ein paar Buchstaben weiter nicht enthält. Wenn ich dieses Modul nun im Layout von "2 columns" der rechten Spalte hinzufüge, funktioniert die mobile Navigation nicht mehr. Die Menüpunkte werden zwar angezeigt, man kann die Menüpunkte aber nicht anklicken. Um auszuschließen, dass das Problem vor dem PC sitzt und um auszuschließen, dass nicht meine Installation an sich das Problem ist, habe ich das Ganze in der Online-Demo nachgestellt. Aber auch dort zeigt sich das gleiche Verhalten.
    Hat jemand eine Erklärung hierfür?


    Gruß
    Norbert

  2. #2
    Alter Contao-Hase
    Registriert seit
    20.03.2010.
    Ort
    Hannover
    Beiträge
    1.041

    Fehler

    Hallo Norbert,
    ich konnte Dein Problem mit etwas Bastel nachstellen.

    Die "rechte Spalte" ist in der Demo garnicht formatiert.

    Ich hab es nur kurz durchgeschaut, aber folgendes sollte das Problem sein:

    Die Hauptspalte ist im CSS immer auf "flaot: left" gesetzt, ist damit aus dem Fluss genommen. Die rechte Spalte legt sich in diesem Fall für Dich unsichtbar darüber.
    Das merkst Du daran, dass Du keine Texte markieren und auch keine Links klicken kannst.

    Anschauen kannst Du das, wenn Du eine CSS/SCSS-Datei anlegst und diese im Betreffenden Layout als letzte CSS/SCSS-Datei einbindest.

    Nun könntest Du dort folgendes eintragen:

    Code:
            #right {
                border: 3px solid red;
            }
    Damit wird die rechte Spalte rot gerahmt und Du siehst, welchen Platz diese einnimmt.

    Wenn Du nun das oben genannte CSS wieder entfernst und dies durch folgendes CSS austauscht, sollte dieses Problem erstmal gelöst sein:

    Code:
            @media (max-width: 767px) {
                #main {
                            float: none !important;
                }
            }
    Ich habe dies nur rudimentär getestet.
    Bei weiteren Fehlern mit der rechten Spalte, einfach wieder hier melden.

    Allerdings wirst Du nun trotzdem selbst noch im CSS tätig werden müssen, denn die rechte Spalte klebt ohne Abstand direkt am Rand.

  3. #3
    Contao-Yoda Avatar von MacKP
    Registriert seit
    15.06.2009.
    Ort
    Duisburg
    Beiträge
    13.287
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Hallo nmk,
    klingt ganz nach position und z-index 'Problemen'. D.h. Der Content überdeckt die Navigation. Kann man mit beliebigen Webdeveloper Tools herausfinden (also in jedem aktuellen Browser per Element untersuchen).
    Um mehr zu sagen brauchen wir einen Link zu deiner Testseite.

    Viele Grüße
    Contao Pool | C-C-A | MetaModels | [Internetseite -> Mediendepot Ruhr]
    [Arbeitet bei -> Paus Design & Medien]
    "I can EXPLAIN it to you, but I can't UNDERSTAND it for you."

  4. #4
    Contao-Nutzer
    Registriert seit
    02.09.2009.
    Ort
    Düsseldorf
    Beiträge
    31

    Standard

    Hallo zusammen,

    es war genau so, dass sich die rechte Spalte über die Hauptspalte gelegt hat. Das konnte man mit der von Samuel beschrienen SS/SCSS-Datei oder auch mit einem Webdeveloper Tool (Hinweis von MacKP) sichtbar machen. Ich habe das jetzt wie von Samuel beschrieben gelöst.

    Code:
    @media (max-width: 767px) {
    #main {
    float: none !important;
    }
    }
    Danke für die Hilfe.

    Gruß Norbert
    Geändert von nmk (26.08.2018 um 09:07 Uhr)

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •