Home → Contao →

Verwendung: MainNavigation unter den Logo links platzieren

• Edit

Sascha von der Heide

14 Feb, 2021 04:04 PM

Produkt: Tao Contao

Moin,

ich habe ein etwas grosses Logo, sodass ich gerne die Navigation immer unter dem Logo haben möchte. Ich hatte hier im Forum schon etwas gesucht und bin bei folgendem CSS hängengeblieben, das sollte dem Support nach genau dafür sorgen. Ich habe es in die custrom.css eingebaut, aber nun wird die Hauptnavigation vom Logo verdeckt. Wo ist mein Fehler?

.header-navigation-inner {
    height: 10em;
    min-height: 7em;
}
@media screen and (max-width: 900px) {
    .header-navigation-inner {
        height: auto;
        min-height: 0;
    }
}
.logo {
    top: 1em;
    bottom: 4em;
}
.main-navigation {
    position: absolute;
    left: 2%;
    bottom: 0;
    width: 96%;
    height: 4em;
}
@media screen and (max-width: 900px) {
    .main-navigation {
        position:relative;
        bottom: auto;
        left: auto;
        height:3.125em;
    }
}

1. Support Staff 1 Posted by RockSolid Theme... on 15 Feb, 2021 08:38 AM

   

   Wir haben den CSS-Code soeben erneut getestet und konnten keine Probleme damit feststellen.

   Damit wir Ihnen zielgerichteter weiterhelfen können, schicken Sie uns bitte einen Link zur betroffenen Seite.

   • Edit

2. 2 Posted by Sascha von der ... on 15 Feb, 2021 08:49 AM

   

   Guten Morgen,

   sehr gerne: [Link entfernt]

   Mit freundlichen Grüßen

   • Edit

3. Support Staff 3 Posted by RockSolid Theme... on 15 Feb, 2021 08:59 AM

   

   Anscheinend ist die Reihenfolge der eingebunden CSS-Dateien auf Ihrer Website fehlerhaft. Bitte bearbeiten Sie die Layouteinstellungen im Backend unter „Layout › Themes › Tao Seitenlayouts“ und ändern Sie die Reihenfolge der „Externen Stylesheets“ wie folgt:

   1. normalize.css
      
   2. icons.css
      
   3. main.css
      
   4. custom.css

   Haben Sie diese Reihenfolge zuvor selbst verändert?

   • Edit

4. 4 Posted by Sascha von der ... on 15 Feb, 2021 09:50 AM

   

   Super, vielen Dank so klappt es.
   Nein ich habe die Reihenfolge nicht verändert, zumindest kann ich mich nicht daran erinnern.

   Mit freundlichen Grüßen

   • Edit

5. 5 Posted by Sascha von der ... on 20 Feb, 2021 03:14 PM

   

   Hallo,

   ich muss mich doch nochmal melden, jetzt habe ich gesehen das es ein neues Problem gibt.
   Am Laptop mit dem Safari und anderen Browsern kann ich die mobile Webseite aufrufen.
   Wenn ich das mit dem iPhone versuche, kommt die mobile Navigation nicht.

   Ich habe mal einen Screenshot angefügt.

   Mit freundlichen Grüßen

   • IMG_5325.PNG 670 KB
   • Edit

6. 6 Posted by Sascha von der ... on 20 Feb, 2021 04:19 PM

   

   Ich habe den Fehler gefunden. Das Responsive CSS war nicht eingebunden. Was ich etwas merkwürdig finde, ich bin sicher das ich das nicht rausgenommen habe.
   Egal, die mobile Navigation läuft jetzt.

   • Edit

7. Support Staff 7 Posted by RockSolid Theme... on 22 Feb, 2021 10:26 AM

   

   Vielen Dank für Ihre Frage.

   In den Layouteinstellungen muss das CSS-Framework „Responsives Layout“ nicht aktiviert werden.

   Ihre Fehlerbeschreibung deutet darauf hin, dass in den Einstellungen des Layouts unter „Experteneinstellungen › Viewport-Tag“ der Wert width=device-width,initial-scale=1.0,shrink-to-fit=no,viewport-fit=cover fehlt.

   • Edit

8. 8 Posted by Sascha von der ... on 24 Feb, 2021 07:40 AM

   

   Moin,

   richtig - fragen sie mich nicht warum, ich habe die Einstellungen aus dem Layout entfernt. Aber dann nicht auf den Fehler kommen…. vielen Dank für Ihre Hilfe.
   Ich habe es wieder eingefügt und alles ist gut.

   Mit freundlichen Grüßen

   • Edit