<header><nav>Nav</nav></header>
<main>
  <h1>Header</h1>
  <p>This is paragraph 1</p>
  <p>This is paragraph 2</p>
  <p>This is paragraph 3</p>
  <p>This is paragraph 4</p>
  <p>This is paragraph 5</p>
  <p>This is paragraph 6</p>
  <p>This is paragraph 7</p>
  <p>This is paragraph 8</p>
  <p>This is paragraph 9</p>
  <p>This is paragraph 10</p>
  <p>This is paragraph 11</p>
  <p>This is paragraph 12</p>
  <p>This is paragraph 13</p>
  <p>This is paragraph 14</p>
  <p>This is paragraph 15</p>
  <p>This is paragraph 16</p>
  <p>This is paragraph 17</p>
  <p>This is paragraph 18</p>
  <p>This is paragraph 19</p>
  <p>This is paragraph 20</p>
  <p>This is paragraph 21</p>
  <p>This is paragraph 22</p>
  <p>This is paragraph 23</p>
  <p>This is paragraph 24</p>
  <p>This is paragraph 25</p>
  <p>This is paragraph 26</p>
  <p>This is paragraph 27</p>
  <p>This is paragraph 28</p>
  <p>This is paragraph 29</p>
  <p>This is paragraph 30</p>
  <p>This is paragraph 31</p>
  <p>This is paragraph 32</p>
  <p>This is paragraph 33</p>
  <p>This is paragraph 34</p>
  <p>This is paragraph 35</p>
  <p>This is paragraph 36</p>
  <p>This is paragraph 37</p>
  <p>This is paragraph 38</p>
  <p>This is paragraph 39</p>
  <p>This is paragraph 40</p>
  <p>This is paragraph 41</p>
  <p>This is paragraph 42</p>
  <p>This is paragraph 43</p>
  <p>This is paragraph 44</p>
  <p>This is paragraph 45</p>
  <p>This is paragraph 46</p>
  <p>This is paragraph 47</p>
  <p>This is paragraph 48</p>
  <p>This is paragraph 49</p>
  <p>This is paragraph 50</p>
  <p>This is paragraph 51</p>
  <p>This is paragraph 52</p>
  <p>This is paragraph 53</p>
  <p>This is paragraph 54</p>
  <p>This is paragraph 55</p>
  <p>This is paragraph 56</p>
  <p>This is paragraph 57</p>
  <p>This is paragraph 58</p>
  <p>This is paragraph 59</p>
  <p>This is paragraph 60</p>
  <p>This is paragraph 61</p>
  <p>This is paragraph 62</p>
  <p>This is paragraph 63</p>
  <p>This is paragraph 64</p>
  <p>This is paragraph 65</p>
  <p>This is paragraph 66</p>
  <p>This is paragraph 67</p>
  <p>This is paragraph 68</p>
  <p>This is paragraph 69</p>
  <p>This is paragraph 70</p>
  <p>This is paragraph 71</p>
  <p>This is paragraph 72</p>
  <p>This is paragraph 73</p>
  <p>This is paragraph 74</p>
  <p>This is paragraph 75</p>
  <p>This is paragraph 76</p>
  <p>This is paragraph 77</p>
  <p>This is paragraph 78</p>
  <p>This is paragraph 79</p>
  <p>This is paragraph 80</p>
  <p>This is paragraph 81</p>
  <p>This is paragraph 82</p>
  <p>This is paragraph 83</p>
  <p>This is paragraph 84</p>
  <p>This is paragraph 85</p>
  <p>This is paragraph 86</p>
  <p>This is paragraph 87</p>
  <p>This is paragraph 88</p>
  <p>This is paragraph 89</p>
  <p>This is paragraph 90</p>
  <p>This is paragraph 91</p>
  <p>This is paragraph 92</p>
  <p>This is paragraph 93</p>
  <p>This is paragraph 94</p>
  <p>This is paragraph 95</p>
  <p>This is paragraph 96</p>
  <p>This is paragraph 97</p>
  <p>This is paragraph 98</p>
  <p>This is paragraph 99</p>
  <p>This is paragraph 100</p>
</main>

:root {
  --nav-font-size: 100px;
}

body {
  position: relative;
  margin: 0; 
  font-family: sans-serif;
  text-align: center;
  /* Uncomment below if using position fixed */
  /*padding-top: var(--nav-font-size);*/
}

header {
  position: sticky;
  /*position: fixed;*/
  top: 0;
  width: 50%;
  background-color: rebeccapurple;
  font-size: var(--nav-font-size);
}