<main class="parent">
  <article class="children-absolute">Centré</article>
</main>

<main class="parent">
  <article class="children-relative">Centré</article>
</main>

<main class="parent">
  <article class="children-relative-inline">Centré</article>
</main>

.parent {
  position: relative;
  border: 1px solid red;
  margin-bottom: 30px;
}

.children-absolute {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  border: 1px solid blue;
}


.children-relative {
  position: relative;
  width: 45px;
  left: 50%;
  transform: translateX(-50%);
  border: 1px solid blue;
}


.children-relative-inline {
  display: inline-block;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  border: 1px solid blue;
}