Despite searching extensively on Google, I have not been able to find a solution to this frequently asked question.
My challenge is to consistently position the footer at the bottom of the page, even when there is minimal content present. Below is an excerpt from my app.blade.php file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Finanzraketen</title>
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
<style>
.hintergrund {
background-image: url('/background.jpeg');
background-size: cover;
}
</style>
</head>
<body class="hintergrund pb-18">
<nav class="bg-white shadow-lg bg-gradient-to-r from-green-400 to-blue-500 mb-10 h-20">
<div class="max-w-full mx-auto px-4">
<div class="flex justify-between">
<div class="flex space-x-0">
<!-- Navbar items here -->
<div class="hidden md:flex items-center space-x-3">
<ul class="flex items-center pl-2 grid grid-cols-8 gap-2">
<a class="py-2 px-2 font-medium text-black rounded shadow transition text-sm border-2 border-black border-opacity-20 text-center
duration-500 ease-in-out transform hover:-translate-y-1 hover:scale-100"
href="{{ route('overview') }}">Stellenanzeigen</a>
@auth('web')
<a class="py-2 px-2 font-medium text-black rounded shadow transition text-sm border-2 border-black border-opacity-20 text-center
duration-500 ease-in-out transform hover:-translate-y-1 hover:scale-100"
href="{{ route('alle_bewerbungen') }}">Bewerbungen</a>
</nav>
@yield('content')
<footer class="bg-gradient-to-r from-green-400 to-blue-500 opacity-60 p-4 relative w-full">
<div class="bg-light py-4">
<div class="container text-center">
<p class="text-muted mb-0 py-2">© 2019 Bootstrapious All rights reserved.</p>
</div>
</div>
</footer>
</body>
</html>I've experimented with various Tailwind CSS position attributes like absolute, relative, and using classes such as inset-x-0 bottom-0, but none have worked for me. Despite scouring numerous Stack Overflow questions on the topic, I haven't found a solution yet. Any assistance would be greatly appreciated!