Use spacing utilities instead of pixel padding

[aalaap]

If you use the Bootstrap 4 spacing utilities (py-5, pb-5 etc.) on the sections and the header, there will be no need for a separate custom CSS file, making this a pure Bootstrap 4 template.

Example:

<section id="about" class="py-5">
    ...
</section>

It appears to be a bit tricky with the header, however. The spacing provided by py-5 isn't enough, so it'll need to be applied to both header and the container div inside it. And then a few more...

<header class="bg-primary text-white py-5">
    <div class="container text-center py-5">
      <h1 class="pt-5">Welcome to Scrolling Nav</h1>
      <p class="lead pb-4">A landing page template freshly redesigned for Bootstrap 4</p>
    </div>
</header>

This could take a bit more utility classes to make it look fine on smaller screens, but in the end, the removal of custom CSS is worth it.

[davidtmiller]

I'd agree that the usage of the utility classes is a good thing all around, but in this case the added benefit of having a CSS file included with this template allows for users to have a stylesheet to build upon.

For that reason I'd rather keep the HTML a bit more tidy, and have the custom stylesheet ready for users to customize - opposed to users having to create a CSS file and link it up on their own.

In almost all other circumstances I'd go with the utility classes, as I've done across the board with just about every theme, template, and snippet on Start Bootstrap - but this is a rare circumstance where I think a stylesheet is worth it.

[aalaap]

That's a fair point. I guess I've just been getting a little too influenced by Tailwind lately!