I am facing an issue with maintaining space above the Title in my design. The design includes elements like Title, Description, and Image. The challenge is to ensure that there is a 20px space above the Title, as shown in the example below:
https://i.sstatic.net/Juffn.jpg
In the image provided, you can see that there is a block of space above the title. My goal is to preserve this space even if the Title and Description are not present. For instance, as demonstrated in this example:
https://i.sstatic.net/QmxBm.jpg
The current problem I am facing is that when the Title and Description are not present, the space collapses, causing the image to move up and occupy that space. I have tried applying min-height to the "titleName" class, but it has not been effective.
<div class="myComponent">
<div class="myContainer">
<div id="head_Title" class="mainTitle">
<h2 class="titleName"> This is a Title</h2>
</div>
<div id="description" class="mainDescription"></div>
</div>
</div>