After creating my web portfolio, I encountered an issue when viewing it on my phone. The navbar collapses but is not properly aligned and there is extra space on the right side of the viewport in the hero section that I can't seem to fix.
Portfolio Link:
HTML code:
<header class="navigation fixed-top">
<nav class="navbar navbar-expand-lg navbar-dark">
.... (omitted for brevity)
</section>
<!-- /hero area -->
<!-- about -->
<section class="section">
.... (omitted for brevity)
</section>
CSS Code:
.navigation {
padding: 40px 100px;
transition: .3s ease;
}
.... (omitted for brevity)
.layer-bg {
position: absolute;
bottom: 0;
left: 0;
}