After putting bootstrap drop-down inside, containing <a></a>is not working, even though drop down is working fine, it has also messed up with styling after incorporating, thanks in advance
<a href="{% url 'jobmanage:job-det' val.id %}" class="card-link"> <-- this link is not working
<div class="card jobs_cards" >
<div class="card-body">
<div class="dropdown">
<a href="" class="btn btn-scondary" dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="fas fa-bars"></i></a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</div>
<h5 class="card-title">
{{val.title}}
</h5>
<h6 class="card-subtitle mb-2 text-muted">{{val.cmpny_name.name}}</h6>
<h5 class="card-subtitle mb-2 text-muted">{{val.salary_start}} - {{val.salary_end}}</h5>
<p class="card-text">{{val.job_description}}</p>
</div>
</div>
</a>
It is not a good method(not possible) to have your styles (card, heading...) inside <a> tag .
Instead you can use JS function to open the link on click of card :
<div class="card jobs_cards" onclick="myFunction()">
</div>
function myFunction() {
window.open("wwww.urlGoesHere.com", "_top");
}