Trying to ensure that the width of the header matches the intrinsic width of the content as divs are meant to occupy the full width.
Attempted applying overflow:auto to html,body,header
https://codesandbox.io/s/xrn9q6ojxw
<head>
<title>Parcel Sandbox</title>
<meta charset="UTF-8" />
<style>
header {
display: block;
background: blue;
}
.content {
width: 2000px;
background: yellow;
}
</style>
</head>
<body>
<div id="app"></div>
<header>header</header>
<div class="content">content</div>
</script>
</body>
</html>
Expecting the entire page to scroll horizontally and have the width of the header matching either the content or body.
Is there a way for the header or div blocks to extend beyond the viewport's width without explicitly specifying a width?