CSS - How to force elements to 100% of remaining/available space of parent element without extending beyond it?

Question

This seems like a really amateur question, in my opinion, but nonetheless it\'s still a frustrating anomaly.

This is actually the 2nd part of a 2 part problem. The firs

Answer 1

You can use absolute positioning.

#b {
    width: 40em;
    height: 20em;
    position:relative;
    background: red;
}
#c {
    position: absolute;
    top: 1em;
    bottom: 1em;
    left: 1em;
    right: 1em;
    background: blue;
}