[Résolu] Comment centrer un menu

Bonjour à tous,

Je me résigne à demander de l'aide.
J'ai récupéré des bouts de codes ici et là pour "construire" un site internet pour le boulot.

Celui-ci est composé d'un menu, que j'ai pu affiner avec des couleurs, la classe active et quelques améliorations, mais je sèche sur un truc, probablement tout bête, mais je ne trouve pas.

Comment centrer ce menu !
Actuellement je triche avec margin-left, en mettant une valeur en px, mais forcément, d'un écran à l'autre (taille différente), le centrage n'est pas respecté, c'est du bidouillage.

Je voudrais réussir à centrer ce menu, et que ce soit effectif quelque soit l'écran, alors si quelqu'un a la solution ici, je suis très preneur

Voici mon CSS gérant le menu en question,

/*** Paramètres généraux du menu horizontal (taille, couleur, hauteur...) ***/

.menu{
  background: #000000;
  position: fixed;
  width: 100%;
}
.menu nav{
  position: relative;
  display: flex;
  margin: 2px auto;
  height: 46px;
}
nav .content{
  display: flex;
  align-items: center;
}

/*** Paramètres des liens dans le menu horizontal (taille, couleur, emplacement...) ***/

nav .content .links{
  margin-left: 370px; /* c'est ici que je "centre" mon menu */
  display: flex;
}
.content .links li{
  list-style: none;
  line-height: 70px;
}
.content .links li a,
.content .links li label{
  color: #fff;
  font-size: 14.5px;
  font-weight: 450;
  padding: 9px 14px;
  border-radius: 3px;
  transition: all 0.2s ease;
}
.content .links li a:hover,
.content .links li label:hover{
  background: #064265;
}
.content .links li a.active{
  background: #064265;
}
.content .links li:not(:last-child){
  margin-right: 5px;
}

Et voici comment j'appelle le menu dans mes pages

  <div class="menu">
  <nav>
  	
  <div class="content"> 
  <ul class="links">	

  <li><a href="../pages/mainlevee.html">Mainlevées</a></li>
  <li><a href="../pages/avenants.html" class="active">Avenants</a></li>
  <li><a href="../pages/modifications simples.html">Modifications simples</a></li>
  <li><a href="../pages/attestations.html">Attestations</a></li>
  <li><a href="../pages/chf.html">CHF</a></li>
  <li><a href="../pages/outils.html">Outils</a></li>

  </nav>
  </div>

Je n'ai pas trop de notions en développement, j'ai essayé plein de choses trouvées sur internet et je suis parvenu à tout ce que je voulais, mais pas pour le centrage du menu.

Merci pour l'éventuelle aide qui me sera apportée
Modifié par Barood3rs (26 Feb 2023 - 09:39)

Tu peux centrer les éléments du menu en ajoutant justify-content: center; au CSS de ul.links ou ajouter cette règle a .content pour qu'elle centre .links
Modifié par Halop (26 Feb 2023 - 12:21)

Halop,
Je te remercie pour cette réponse.
Puis-je abuser en te demandant de l'écrire s'il te plaît (le code) ?
Car je n'ai pas de ul dans mon css

Je viens de faire des essais avec les informations que tu m'as fournies, mais il ne se passe rien, donc j'en déduis que je m'y prends mal.
Modifié par Barood3rs (26 Feb 2023 - 13:41)

J'ai trouvé c'est bon.

Merci