After exhausting all available resources such as documentations and Stack Overflow answers, I am still unable to resolve the issue. Here is a snippet of the code I have tried:
<meta name="viewport" content="width=device-width, initial-scale=1">
I have attempted various solutions like using @@meedia in the style and setting w-100 on the card body, but nothing seems to work. I need the entire application to maintain a normal width, so any assistance would be greatly appreciated. My development environment consists of Visual Studio 2022 with .NET 6.
Specifically, when launching the application on desktop and switching to mobile view by pressing F12, the length of the card-body extends beyond the screen size. I am trying to set the width of the card-body to match the mobile screen size.
The code snippet in question is as follows:
<div class="row">
<div class="col-sm-4">
<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-4">
<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-4">
<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>
Despite my efforts, the outcome remains unchanged.