css how to adjust height of element content

Issue

This is an example of html code :

<div class="container-fluid" id="about">
     <div class="row">
            <div id="mainsubtitle">Something</div>
            <h1>Validation of the email address</h1>
     </div>

</div>

How can I adjust height (blue area) of the div and h1 element to have

Solution

My understanding from the screenshots to your question is that you are trying to reduce the blue space, so essentially the space between the words and the div and h1 elements.

You can try to play around with the line-height property.
Example:

#mainsubtitle, h1 {
   line-height: 0.75;
}

The above example multiplies the current font-size with 0.75 to set the line height.

Answered By – Aaron

Answer Checked By – Dawn Plyler (AngularFixing Volunteer)