Мне нужно разместить ссылку по середине страницы, она в виде кнопки показана. Выбираю разные display, при block она по всей ширине размазывается, казалось бы можно указать ширину, но мне нужно чтобы без ширины было, только на основании текста + padding. Остальные display просто по левому краю прижимают, даже при text-align: center
<!doctype html>
<meta charset="utf8">
<title>Title</title>
<link rel="stylesheet" href="stl.css">
<div style="height: 680px; background: yellow; box-sizing: border-box;">
<h1 style="text-align: center; margin-top: 10rem; margin-bottom: 5rem; width: 100%; font-family:'Trebuchet MS', Arial, sans-serif; display: inline-block; font-size: 6rem">Global Howk</h1>
<p style="margin: .1rem 15rem 3rem; text-align: center; font-size: 4vh; font-family:'Trebuchet MS', Arial, sans-serif">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt voluptatibus quis tempora iusto, ex! Quam, ipsam totam
non repellat repellendus modi quibusdam accusamus sint eius porro dolorem asperiores maiores placeat.</p>
<a href="#!" style="display: inline-block; box-sizing: border-box; text-align: center; margin: 0 auto; padding: 1.5rem 3rem; font-size: 1rem; color: white; background: black; font-family: 'Trebuchet MS', Arial, sans-serif; text-transform: uppercase; text-decoration: none;">Progress my busines</a>
</div>
<script src="cln.js"></script>
Сложный
