Кнопка не становится по центру

[alex2020]

Добрый день извиняюсь если не по теме форума. Тут проблема не в движке, а в верстке, но все же, кнопка не становится по центру баннера, через css - left:50% так как 100% находится аж за пределами объявления

подскажите как поставить кнопку по центру , чтоб на всех устройствах она была по центру,

код

<style>
.welcomeSectionNY {
position: relative;
background: #e0e0e0 url(/img/banner/reg-band.png);
height: 0;
padding-top: 25.423%;
background-size: cover;
background-position: center;
}

.sharebut {
color: #ffffff;
width: 250px;
height: 40px;
font-size: 20px;
background: #3498db;
border-radius: 5px;
position: absolute;
bottom: 5px;
transition: 0.5s;
text-align: center;
line-height: 40px;
margin-bottom: 10px;
margin-left: 1px;
font-weight: bold;
letter-spacing: -1px;
left: 39%
}

.sharebut:hover {
text-decoration: none;
bottom: 15px;
color: #ffffff;
}

@media only screen and (max-width:650px) {
.welcomeSectionNY {
position: relative;
background: url(/img/banner/reg-band.png);
height: 0;
padding-top: 25.423%;
background-size: cover;
background-position: center;
}
}

@media screen and (min-width:300px) and (max-width:450px) {
.sharebut {
width: 115px;
height: 15px;
font-size: 10px;
line-height: 15px;
margin-bottom: 2px;
margin-left: -4px;
left: 34%
}
}

@media screen and (min-width:451px) and (max-width:649px) {
.sharebut {
width: 160px;
height: 20px;
font-size: 13px;
line-height: 20px;
margin-bottom: 10px;
margin-left: 5px
}
}

@media screen and (min-width:650px) and (max-width:824px) {
.sharebut {
margin-left: 40px;
width: 160px;
height: 20px;
font-size: 13px;
line-height: 20px;
margin-bottom: 15px
}
}

@media screen and (min-width:825px) and (max-width:1000px) {
.sharebut {
margin-bottom: 20px;
margin-left: 55px
}
}

</style>

<a href="#" class="sharebut">Читать</a>

 

[grisha2217]

К кнопке - позиционирование убрать, добавить:

width: 300px;

margin: 0 auto;

 

[alex2020]

все решил )
нужно было transform: translate(-50%, 0); вставить и все )
всем спасибо )

 

[Skaiman]

Зачем вообще абсолютное позиционирование делать? Картинка фоном, а на нем все что угодно.

 

[alex2020]

Зачем вообще абсолютное позиционирование делать? Картинка фоном, а на нем все что угодно.

ну я не знаю, код делал ты я просто скопировал )

 

[Skaiman]

ну я не знаю, код делал ты я просто скопировал )

Если про код шервуда, то его делал не я :) я только рипнул.

 

[alex2020]

Если про код шервуда, то его делал не я :) я только рипнул.

я понял )
ну главное что у меня получилось сделать )