I'm having trouble getting the "View Profile" link below to appear blue other than through inline styles.Please help or advise. Thanks
The Code:
.view_profile, .view_profile a {
font-style: Georgia;
font-size: 1.125em;
color: #0B88B5;
text-align: center;
font-weight: bold;
}
.view_profile a {
color: #0B88B5;
}
<div class="grid-5 profile_container">
<a href="damon_r.html">
<img src="images/damon_head.jpeg" class="profileimgsml" alt="Damon" />
<div class="our_peopletxt">
<div class="ourpeople_name">Damon</div>
<p class="dotted_row"> ------ </p>
<div class="ourpeople_designation">Office manager</div>
<div class="ourpeople_details">
<div class="contact_details_label">m:</div><a href="tel:9999999"> 99 9999 999 </a><br>
<div class="contact_details_label">e:</div><a href="mailto:damon@damon.com"> damon@damon.com</a><br>
<p class="dotted_row"> ------ </p>
<div class="view_profile"><a href="damon.html" style="color:#0B88B5;">View Profile</a></div>
</div>
</div>
</a>
</div>
color: #0B88B5 !important;
other css styles might be setting it and you need the!important
to override. or setting the correct selector chain, some have precedence over others.!important
is a decent way to check if the issue is due to specificity, so trying it out isn't a bad idea. If it doesn't make a difference, it's not specificity causing it. Leaving it in as a final solution is a bad idea, however.