<div class="parent">
     <img class="background" src="image.jpg">
     <div class="content">
         <h1>Some Text</h1>
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tincidunt magna quis nibh congue hendrerit. Maecenas ultricies diam eget diam volutpat, a posuere leo varius. Pellentesque varius nulla nec felis dapibus, vel varius turpis dignissim. Suspendisse porttitor cursus orci vitae rutrum.</p>
     </div>
</div>


.parent {
    position: relative;
}

.background {
    position: relative;
    z-index: 10;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

.content {
    position: absolute;
    top: 0;
    z-index: 11;
    width: 100%;
    height: 100%;
    padding: 0 3rem;
}

I need to be able to have a flexible height on the parent div that is dependent on the content within it, with the image filling the entire space behind the content; using a background image is not an option, nor is setting an exact height.