%composite-row { display: grid; grid-template-columns: auto 50px; grid-template-rows: 50% 50%; grid-template-areas: 'header actions' 'detail actions'; } %with-one-action-row { @extend %composite-row; grid-template-columns: 1fr auto; padding-right: 12px; } %composite-row-header { grid-area: header; align-self: start; } %composite-row-detail { grid-area: detail; align-self: end; } %composite-row-actions { grid-area: actions; justify-self: center; align-self: center; }