Fist of all add something like

width: max-content;
height: max-content;

to the parent (.house) so this won't happen:

after that just position the child relative (%)

.temp {
  font-size: 25px;
  position: absolute;
  bottom: 50%;
  left: 50%;
  transform: translate(-50%, -50%);    
}

I changed the vertical center to px for this example (because the middle of the house is not in the center):

.temp {
  font-size: 25px;
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translate(-50%, 0);
}