Navbar mittig zentrieren

[Josc]

Hallo liebe Community,

da ich noch ein absoluter Programmieranfänger bin, habe ich mal eine Frage zu einem simplen Problem. Für die meisten unter euch wird das Problem wahrscheinlich aus dem stegreif zu lösen sein.

Ich habe eine navbar in meine CSS-Datei implementiert und nun möchte ich, dass die Navbar mittig angezeigt wird und nicht dauerhaft links. Meiner Vermutung nach liegt es an dem float bei:

#navbar ul li {
  text-align: center;
  float: left;
  list-style: none;
}

Bitte klärt mich über den dummen Fehler auf!

#navbar,
#navbar ul,
#navbar ul li,
#navbar ul li a {
  padding: 0;
  margin: 0;
  line-height: 1;
  font-family: 'Capriola', sans-serif;
}
#navbar:before,
#navbar:after,
#navbar > ul:before,
#navbar > ul:after {
  content: '';
  display: table;
}
#navbar:after,
#navbar > ul:after {
  clear: both;
}
#navbar ul {
  background: url(images/color.png) repeat-x 0px 4px;
  height: 69px;
}
#navbar ul li {
  text-align: center;
  float: left;
  list-style: none;
}
#navbar ul li a {
  display: block;
  height: 37px;
  padding: 22px 30px 0;
  margin: 4px 2px 0;
  border-radius: 2px 2px 0 0;
  text-decoration: none;
  font-size: 15px;
  color: white;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75);
  font-weight: 400;
  opacity: .9;
}
#navbar ul li:first-child a {
  margin: 4px 2px 0 0;
}
#navbar ul li a:hover,
#navbar ul li.active a {
  background: url(images/color.png) center bottom;
  display: block;
  height: 37px;
  margin-top: 0px;
  padding-top: 26px;
  color: #004f7c;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.55);
  opacity: 1;
}

Grüße,
Josc

[monolith]

Wenn du die komplette Seite zu Verfügung stellen kannst, schau ich mir das gerne an, aber mit den von dir geposteten Code-Ausschnitten ist mir das zu ungenau und zu viel Arbeit

[Ma27]

vorweg: das ist KEIN programmieren.

kannste mal nen Screenshot schicken und genau erklären, was du vorhast?

Ich verstehe das jetzt so - bitte korriegieren, wenns falsch ist - dass du die ganze Navbar in der Mitte haben willst.
Das könnte man über margin: auto lösen

Pseudocode:

.center-block {
    margin-left: auto;
    margin-right: auto; 
    width: 1000px;
}

LG

[Josc]

Hallo,

erstmal danke für die Antworten.

Ich verstehe das jetzt so - bitte korriegieren, wenns falsch ist - dass du die ganze Navbar in der Mitte haben willst.

Ganz genau!

Also das ist der ganze CSS-Code:

body { font-family: Arial, Helvetica; margin: 0px; text-align: justify;}
#header {background-repeat: no-repeat; background-color: black; padding-top: 2px; margin: 0px; 
		height: 331px; width: 1870px;}
#navbar,
#navbar ul,
#navbar ul li,
#navbar ul li a {
  padding: 0;
  margin: 0;
  line-height: 1;
  font-family: 'Capriola', sans-serif;
}
#navbar:before,
#navbar:after,
#navbar > ul:before,
#navbar > ul:after {
  content: '';
  display: table;
}
#navbar:after,
#navbar > ul:after {
  clear: both;
}
#navbar ul {
  background: url(images/color.png) repeat-x 0px 4px;
  height: 69px;
}
#navbar ul li {
  float: left;
  list-style: none;
}
#navbar ul li a {
  display: block;
  height: 37px;
  padding: 22px 30px 0;
  margin: 4px 2px 0;
  border-radius: 2px 2px 0 0;
  text-decoration: none;
  font-size: 15px;
  color: white;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75);
  font-weight: 400;
  opacity: .9;
}
#navbar ul li:first-child a {
  margin: 4px 2px 0 0;
}
#navbar ul li a:hover,
#navbar ul li.active a {
  background: url(images/color.png) center bottom;
  display: block;
  height: 37px;
  margin-top: 0px;
  padding-top: 26px;
  color: #004f7c;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.55);
  opacity: 1;
}
#inhalt {text-align: center; padding-left: 20%; padding-right: 20%; text-align: justify; background-color: white;}