Logo Joomla

Joomla Protostar Template mit zentriertem horizontalem Menü

Wer das Protostar Template nutzt und ein horizontales Menü verwendet, dem wird aufgefallen sein, dass es per default am linken Rand ausgerichtet ist.

Wenn man das Menü jedoch in ein horizontales mittig zentriertes Menü ändern möchte, dann kann man folgendes in der template.css ändern:

.nav {
/* margin-left: 0; */
/* margin-bottom: 18px; */
list-style: none;
text-align: center; /*neu*/
}
.navbar .nav {
position: relative;
left: 0;
display: block;
/* float: left; */
}
.navbar .nav > li {
/* float: left;*/
display: inline-block;
}

Wichtig hierbei sind die float’s die entfernt werden müssen und durch ein display:inline-block ersetzt werden. Ebenso ist oben ein text-align: center wichtig.

8 Gedanken zu „Joomla Protostar Template mit zentriertem horizontalem Menü“

  1. Tja, leider auch nix.
    Im übrigen geht es nicht um die Menüleiste, sondern ums Zentrieren der Menüeinträge in der /den Zeilen der Menüleiste.
    Ich kann es gar nicht glauben, dass das eine so verzwickte Angelegenheit ist ?
    Aber vielleicht schaffen wir es doch noch ??
    Danke Ciao
    Girgei

    Antworten
  2. Schade, es hat nicht funktioniert.
    Wie ist das mit den Leerzeichen beim Auskommentieren ??
    Nachfolgend die entsprechenden Ausschnitte aus der template.css

    .navbar .nav {
    position: relative;
    left: 0;
    display: block;
    /*float: left;*/
    margin: 0 10px 0 0;
    }

    Antworten
    • Hallo Girgei,
      oh ich denke ich weiß was du meinst. Einfach die entsprechenden Zeilen auskommentieren. In meinem Beispiel sind das die Zeilen mit einem /* Slash und Stern. Außerdem unten den Satz umsetzen.

      Antworten

Schreibe einen Kommentar

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.