HTML/CSS CSS Menü zentrieren

[WeSt]

Hallo zusammen,

ich bräuchte bitte mal Hilfe.

Und zwar hab ich keinen Schimmer von CSS. Hab mir jetzt MySQL und PHP selbst beigebracht, aber bei CSS bin ich noch nicht.

Daher habe ich mir die Vorlage eines CSS Menüs im www gesucht. Nun möchte ich dies aber zentriert auf der Seite haben und nicht linksbündig.
Kann mir da jemand helfen?

Hier ist die Style Datei zu finden:
https://konsolika.de/menue/css3menu1/style.css

Im Seitenquelltext sieht das Menü so aus:

Header:

<link rel="stylesheet" href="menue/css3menu1/style.css" type="text/css" /><style type="text/css">._css3m{display:none}</style>

Body:

<input type="checkbox" id="css3menu-switcher" class="c3m-switch-input" align="center">
<ul id="css3menu1" class="topmenu" align="center">
<li class="switch"><label onclick="" for="css3menu-switcher"></label></li>
<li class="topfirst"><a href="index.php" style="height:24px;line-height:24px;"><img src="menue/css3menu1/blue-home2.png" alt=""/>Startseite</a></li>
<li class="topfirst"><a href="index.php?module=news" style="height:24px;line-height:24px;"><img src="menue/css3menu1/blue-home2.png" alt=""/>News</a></li>
<li class="topmenu"><a href="#" style="height:24px;line-height:24px;"><span><img src="menue/css3menu1/blue-database.png" alt=""/>Tages-Top-Angebote</span></a>
<ul>
<li><a href="index.php?module=topoffers&plattform=4">PlayStation 3</a></li>
<li><a href="index.php?module=topoffers&plattform=1">PlayStation 4</a></li>
<li><a href="index.php?module=topoffers&plattform=5">xBox 360</a></li>
<li><a href="index.php?module=topoffers&plattform=2">xBox One</a></li>
<li><a href="index.php?module=topoffers&plattform=3">Wii U</a></li>
</ul></li>
<li class="topmenu"><a href="#" style="height:24px;line-height:24px;"><span><img src="menue/css3menu1/blue-screen.png" alt=""/>Spiel wählen...</span></a>
<ul>
<li><a href="#"><span>PlayStation 3</span></a>
<ul>
<li><a href=\"index.php?plattform=1&titel=$row->lnr\">$row->titel</a></li>
</ul></li>
<li><a href="#"><span>PlayStation 4</span></a>
<ul>
<li><a href=\"index.php?plattform=1&titel=$row->lnr\">$row->titel</a></li>
</ul></li>
<li><a href="#"><span>xBox 360</span></a>
<ul>
<li><a href=\"index.php?plattform=1&titel=$row->lnr\">$row->titel</a></li>
</ul></li>
<li><a href="#"><span>xBox One</span></a>
<ul>
<li><a href=\"index.php?plattform=1&titel=$row->lnr\">$row->titel</a></li>
</ul></li>
<li><a href="#"><span>Wii U</span></a>
<ul>
<li><a href=\"index.php?plattform=1&titel=$row->lnr\">$row->titel</a></li>
</ul></li>
</ul></li>
<li class="topmenu"><a href="index.php?module=kontakt" style="height:24px;line-height:24px;"><img src="menue/css3menu1/blue-mail.png" alt=""/>Kontakt</a></li>
<li class="topmenu"><a href="index.php?module=impressum" style="height:24px;line-height:24px;"><img src="menue/css3menu1/blue-info.png" alt=""/>Impressum</a></li>
<li class="toplast"><a href="https://www.facebook.com/ps3heaven/" style="height:24px;line-height:24px;"><img src="menue/css3menu1/blue-fbook.png" alt=""/>Facebook</a></li>
</ul><p class="_css3m"><a href="https://css3menu.com/">css3 menu</a> by Css3Menu.com</p>
<!-- End css3menu.com BODY section -->

 

[kbot]

https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Positionierung

hilft dir das weiter?

 

[WeSt]

nicht so richtig :-(

Wie gesagt, CSS ist völliges Neuland für mich

 

[kbot]

dann vielleicht das, was man als erstes Google-Ergebnis bekommt?

https://www.ich-lerne-css.de/Style/Examples/007/center.html

 

[jo_237]

Hier: https://jsfiddle.net/cgzckqrx/

Aber am besten du startest direkt mit einem Framework, statt dir alles in Handarbeit zusammenzuflicken.

 

[WeSt]

das hat tatsächlich funktioniert.....

vielen dank!!

 

[Killerbear]

Aber am besten du startest direkt mit einem Framework, statt dir alles in Handarbeit zusammenzuflicken.

Das empfehle ich dir auch.
Das populärste und verbreiteste Framework
https://getbootstrap.com/

oder das etwas weniger populäre Framework
https://foundation.zurb.com/

Ansich ist Foundation das besser responsive Web Framework.
Weil bootstrap nur eine Art adaptiv Web Framework bietet.
Aber bootstrap (abgesehen von der schlechteren responsive Umsetzung) hat die besseren und verbreiteteren Funktionalitäten.

 

[theHacker]

NICHT Foundation!

Die haben vor über einem halben Jahr die Version 6 rausgebracht und bis heute es nicht auf die Reihe gebracht, einen Upgrade-Guide rauszubringen. Im Dezember noch "ja ja, machen wir" und seitdem werden zig Nachfragen einfach ignoriert