Tengo 2 DIVs, de los cuales unos es el header(quiero que este verticalmente a la izquierda) y otro es el cuerpo de la pagina(quiero que este en la parte derecha). Utilizo flex para posicionarlos, el header quiero que este fijo por lo tanto le pongo un position:fixed. El problema viene en el div del cuerpo, quiero que solo ocupe el ancho posible teniendo en cuenta el header, pero al estar el header en position fixed el div del cuerpo también coge el ancho respectivo del header.
app.component.html
<div class="row">
<app-header></app-header>
<section>
<router-outlet></router-outlet>
</section>
</div>
scss header
.header {
position: fixed;
width: 200px;
height: 100vh;
}
html body
<main style="width: 100%"class="row-center-wrap">
<section>
<p>Aaaaaaaaaaaaaaaaaaaa</p>
</section>
</main>