I've exhausted all my options, including documentation and the last 10 stack overflow answers, but nothing seems to be working. I even tried using:
<meta name="viewport" content="width=device-width, initial-scale=1">
I attempted @@meedia in style, w-100 on card body - everything, but nothing is solving the issue. I need the entire application to display with a normal width, so please assist me. I am using VS 2022 with .NET 6.
When I launch the application on desktop and switch to mobile view using F12, the card-body appears stretched out. I want to set the width of the card-body to match the size of the mobile screen. I can't seem to pinpoint where the problem lies...
The code snippet looks like this:
<div class="row">
<div class="col-sm-12">
<div class="card bg-light w-100 p-0">
<div class="card-body">
<a class="nav-link text-dark" asp-area="" asp-controller="Oglas" asp-action="ProdajaKuce">Prodaja kuća</a>
</div>
</div>
</div>
<div class="col-sm-12">
<div class="card bg-light w-100 p-0">
<div class="card-body">
<a class="nav-link text-dark" asp-area="" asp-controller="Oglas" asp-action="ProdajaStanova">Prodaja stanova</a>
</div>
</div>
</div>
<div class="col-sm-12">
<div class="card bg-light w-100 p-0">
<div class="card-body">
<a class="nav-link text-dark" asp-area="" asp-controller="Oglas" asp-action="ProdajaNekretninaZaOdmor">Prodaja nekretnina za odmor</a>
</div>
</div>
</div>
However, the end result remains unchanged. Disappointing indeed.