Aqui eu usei o `width: inherit;` basicamente o `inherit` herda a largura do elemento pai, assim não ultrapassa o elemento pai..


<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-css -->

    html, body {width: 100%;height: 100%}
    .pagina {display: flex;flex-direction: column;background: #ccc;width: 80%;height: 100%;margin: 0 auto;position: relative}
    .bloco1 {background: green}
    .bloco2 {background: pink;position: fixed;bottom: 0;width: inherit;}

<!-- language: lang-html -->

    <div class="pagina">
      <div class="bloco1">Bloco 1</div>
      <div class="bloco2">Bloco 2 - Esse é fixo no final da página</div>
    </div>

<!-- end snippet -->