Simple Bootstrap Navbar Question

Hey all, I tried searching and still cannot come up with a soluation.

I have my navbar at the bottom of the page and i want my body to fill the rest of the top.

I don’t just want to add padding because padding wont be responsive. my body is just an image and that needs to be responsive.

Is there another way to add the navbar to the bottom of the page but fill the rest of the body with a responsive image?

Have you tried something like:

// CSS

.main {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 100vh;
}


// HTML

<body>
    <div class="main">
        <img />
        <nav>
             ... nav stuff
        </nav>
    </div>
</body>

With this, the navbar will always remain at the bottom, even if the image doesn’t fill all of the space above it.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.