css circular image anchor too large - css

Question

I'm currently displaying a users profile picture in php and if they click on it, then it takes them through to their own profile. The image displays correctly and the link works, but the area of the link extends way beyond the picture and over a link nearby. How would I go about reducing the area of the anchor?
<?php } if ($searchuser == $username)
{ ?>
<a href="profile.php">
<?php } ?>
<div style="background-image: url('<?php echo $profilepic; ?> ')" class="user-pic"></div>
<?php if ($searchuser == $username)
{?>
</a>
div.user-pic {
margin: 0 auto;
width: 125px;
height: 125px;
border-radius: 50%;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
border: 0.09em solid white;
position: relative;
top: -60px;
padding: 0px;
z-index: -100;
}

Answer 1

Try with this:
php
<?php }
$show_user_link = false;
if ($searchuser == $username) {
$show_user_link = true;
}
?>
<div style="background-image: url('<?php echo $profilepic; ?>')" class="user-pic">
<?php if( $show_user_link ): ?>
<a class="user-link" href="profile.php">
</a>
<?php endif; ?>
</div>
css
div.user-pic {
position: relative;
}
a.user-link {
height: 125px;
width: 100%;
}
You put the anchor in within the div tag and then you could make div's position relative and anchor's width to 100%.
PS: You could try to use something like
<?php if(true): ?>
<strong> some html </strong>
<?php endif; ?>
when mixing php and html to make your code more readable.
--- EDIT
Ok, I understand, see if the new code is more helpfull now, the only thing I think that could go wrong is the height of the anchor in case it isnt fixed to 125px, say me if you have problems with it.