Comment centrer un bouton d'une image
BruceyBandit
ayez juste une simple question HTML CSS. Comment placer un bouton sur l'image au centre ?
Code actuel :
.button-link{
text-decoration:none !important;
color:white;
}
.button-td{
background:#FFA06A;
text-align:center;
}
<table align="center" border="0" cellpadding="0" cellspacing="0" class="center-on-narrow" role="presentation" style="display:table !important;" mc:edit="imagewithcta">
<tr>
<td class="button-td">
<img src="https://images.unsplash.com/photo-1598257006626-48b0c252070d?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1" style="max-width:600px;" alt="photo-1598257006626-48b0c252070d?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1"><a class="button-a sans text-white" href="*|ARCHIVE3|*">
<span class="button-link">
READ MORE
</span>
</a>
</td>
</tr>
</table>
Lazar Nikolic
Cela devrait faire l'affaire, en positionnant le conteneur comme relatif et l'élément comme absolu :
.button-a{
text-decoration: none !important;
color:white;
position: absolute;
top:50%;
left: 50%;
transform: translate(-50%, -50%)
}
.button-td{
background:#FFA06A;
text-align:center;
position: relative;
}