Is it possible to align the text in Line 1 and Line 2 to the left without any gap appearing on the left side of line 2, regardless of the device size?
I have attempted to use various methods such as m-1, p-1, text-left, and even negative padding, but none of them seem to eliminate the space before line 2. Any suggestions would be greatly appreciated.
Here is a JSFiddle link containing the code related to this issue
<h4>Line 1 - Header4 </h4>
<div class="container-fluid">
<h4> Line 2 - Header4 </h4> <!-- THE ISSUE IS HERE -->
<div class="row zz-border-Top2
border-bottom border-primary text-center bg-light">
<div class="col-sm-1 font-weight-bold text-dark bg-warning">
<h6>Text 1</h6>
</div>
<div class="col-sm-2">
<h6> Text 2 </h6>
</div>
<div class="col-sm-9 text-left" style="color:navy;">
<h6>Text 3</h6>
</div>
</div>
</div>