Нужно сделать чтобы div элемент всегда был по высоте экрана и при изменении расширения также не ломался, а чтобы расширялся с соблюдением размеров вложенного в него контента и его собственных внутренних отступов.
<!doctype html>
<meta charset="utf8">
<title>Title</title>
<link rel="stylesheet" href="stl.css">
<div style="height: 100vh; background: yellow; box-sizing: border-box; text-align: center; padding: 5%;">
<h1 style="font-family:'Trebuchet MS', Arial, sans-serif; font-size: 6rem;">Global Howk</h1>
<p style="margin: -1rem 15rem 3rem; font-size: 1.8rem; 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; 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 bussines</a>
</div>
<script src="cln.js"></script>
