Parent div has no dimensions - html

Question

Currently my parent div is showing up as a dimensionless div (0 by 0 px). I am trying to have a flexible parent div thats size is not explicitly mentioned but rather adaps to the size of its content. Here is what I have so far thats producing a 0px by 0px parent. Hope someone can give me a solution.
HTML:
<div class="thumbnailDeal">
<div class="thumbnailImage">
<div class="thumbnailDescription">
<span class="thumbnailTitle">3 Maki Orders</span>
<div class="thumbnailPrices"><span class="thumbnailOriginal">$25</span> $<span class="thumbnailActual">15</span></div>
<br>
<span class="thumbnailRestaurant">New Generation Sushi</span><br>
<span class="thumbnailLocation">11 St Joseph st.</span>
</div>
</div>
</div>
<div class="thumbnailDeal">
<div class="thumbnailImage">
<div class="thumbnailDescription">
<span class="thumbnailTitle">3 Maki Orders</span>
<div class="thumbnailPrices"><span class="thumbnailOriginal">$25</span> $<span class="thumbnailActual">15</span></div>
<br>
<span class="thumbnailRestaurant">New Generation Sushi</span><br>
<span class="thumbnailLocation">11 St Joseph st.</span>
</div>
</div>
</div>
CSS:
.thumbnailDeal{
display: inline-block;
margin:1%;
}
.thumbnailImage{
width:360px;
height:315px;
background-size: cover;
background-image: url(../assets/5.jpeg);
background-position: center center;
background-repeat: no-repeat;
position:absolute;
}
.thumbnailDescription{
height:28%;
width:100%;
background: rgba(0, 0, 0, 0.75);
position:absolute;
bottom:0;
padding:10px;
}
.thumbnailTitle{
color:white;
font-size:17px;
}
.thumbnailRestaurant{
color:#FD8B2B;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size:14px;
}
.thumbnailLocation{
color:#9E9E97;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size:14px;
position:absolute;
left:0px;
bottom:0px;
padding-left:10px;
}
.thumbnailPrices{
font-size:14px;
color:white;
position:absolute;
right:0px;
bottom:-13px;
box-sizing: border-box;
}
.thumbnailOriginal{
text-decoration: line-through;
color:#9E9E97
}
.thumbnailActual{
font-size:50px;
color:white;
position:relative;
right:10px;
}

Answer 1

When you use position: absolute elements get out of the flow and the parent won't have height/width from his childs anymore.
You have to find another way to position your elements if you want to have a proper height/width to the parent :)