Menu zentrieren

[Susi]

Hallo, dieses Menu erfüllt alle meine Wünsche: Linkbeschreibung

Allerdings würde ich die Menüpunkte gerne zentrieren, sie sollen also nicht linksbündig sein, sondern in der Mitte. Float: center; gibt's ja nicht, text-align bringt auch nichts, was muss ich denn machen, damit mein Wunsch in Erfüllung geht?

Vielen Dank!

[Matthias Apsel]

Hallo Susi,

Float: center; gibt's ja nicht, text-align bringt auch nichts, was muss ich denn machen, damit mein Wunsch in Erfüllung geht?

text-align: center für die ul sowie display: inline für die li-Elemente und letztere nicht floaten.

Bis demnächst
Matthias

[MrMurphy1]

Hallo

Das liegt am float der Navigation.

Du kannst diese CSS-Anweisungen

      ul.topnav {
         list-style-type: none;
         margin: 0;
         padding: 0;
         overflow: hidden;
         background-color: #333;
      }
      /* Float the list items side by side */
      ul.topnav li {
         float: left;
      }

folgendermaßen ändern:

      ul.topnav {
         list-style-type: none;
         margin: 0;
         padding: 0;
         overflow: hidden;
         background-color: #333;
         text-align: center;
      }
      /* Float the list items side by side */
      ul.topnav li {
         /*float: left;*/
         display: inline-block;
      }

und diese CSS-Anweisung

   @media screen and (max-width:680px) {
      ul.topnav li:not(:first-child) {
         display: none;
      }
      ul.topnav li.icon {
         float: right;
         display: inline-block;
      }
   }

folgendermaßen

   @media screen and (max-width:680px) {
      ul.topnav {
         text-align: left;
      }
      ul.topnav li:not(:first-child) {
         display: none;
      }
      ul.topnav li.icon {
         float: right;
         display: inline-block;
      }
   }

Dann sollte es passen.

Gruss

MrMurphy

[Susi]

Vielen Dank!!