Não é possível utilizar mais de um id em um elemento, e por definição, um ID não deve se repetir em mais e um elemento em todo documento HTML, deve ser um identificador único para aquele elemento.
Para chegar neste resultado, você pode utilizar as classes (atributo class
), onde é permitido utilizar mais de uma classe em um elemento e reutilizar a classe em mais de um elemento.
Seguindo seu exemplo:
.centralizado1 {
position:absolute;
top=46%;top: 46%;
left=50%;left: 50%;
transform: translate(-46%, -50%)
}
.centralizado2 {
position:absolute;
top=50%;top: 50%;
left=50%;left: 50%;
transform: translate(-50%, -30%)
}
.centralizado3 {
position:absolute;
top=54%;top: 54%;
left=50%;left: 50%;
transform: translate(-54%, -10%)
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class="centralizado1 centralizado2">
<button>A</button>
</div>
<div class="centralizado2 centralizado3">
<button>B</button>
</div>
<div class="centralizado3 centralizado2 centralizado1">
<button>C</button>
</div>
<div class="centralizado3">
<button>C</button>
</div>
</body>
</html>