Having trouble aligning content below a row of anchors/divs that require an offset-md-1. The challenge is making sure the content below aligns with the row above, which has the offset and remains responsive. Adjusting margins on paragraphs causes overflow when the viewport shrinks. Setting a max width with margins auto isn't feasible since the above row isn't exactly centered by design. Any suggestions? Thank you :)
HTML:
<div class="container">
<div class="row">
<a class="offset-md-1 col-md-3 jump-link" href="#">
<div><p class="font__jump-link">Jump Link 1 offset1</p></div>
</a>
<a class="col-md-3 jump-link" href="#">
<div><p class="font__jump-link">Jump Link 2</p></div>
</a>
<a class="col-md-3 jump-link" href="#">
<div><p class="font__jump-link">Jump Link 3</p></div>
</a>
</div>
<div class="row">
<p class="p-below-links">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab assumenda at
commodi dicta, doloremque
earum eius libero neque repudiandae soluta.</p>
</div>
</div>
CSS:
.p-below-links{
max-width:1050px
width: 100%;