LinkButtons behaving differently in the clickable area around the icon ( i don't think it's a front-end issue )

Question

i am working on asp.net webforms project and while testing i noticed that the LinkButton behavior is different and lead to different results. when i click on the LinkButton but outside the icon area : it results a Partial Post-Back. And when i click on the icon it results a full PostBack...

i checked for typos but none was found i tried to put the button inside a update Panel doesn't work i seeked help from my fellow colleagues but not luck ScreenShot of the LinkButtons here

<asp:LinkButton
 ID="PreviewReportBtn"
 OnClick="PreviewReport_Click"
 runat="server"                                                    
 Style="margin: 5%;"
 CssClass="button w-100">
 <i class="fa fa-eye"></i>
</asp:LinkButton>

and the code behind codebehind

protected void PreviewReport_Click(object sender, EventArgs e)
{
    string pathToFiles = Server.MapPath(string.Format("~/Project/Reports/"));
    if( File.Exists(pathToFiles) )
    {
        string path = 
        Page.ResolveClientUrl("~/Pages/Configuration/ShowReport.aspx);
        Response.Write("<script>window.open ('"+path+"','_blank');</script>");
    }
    else
    {
        Alert.Showalert(this," Report File NOT FOUND", new Danger());
    }
 }

Answer 1

i solved the issue by adding to the LinkButton

AutoPostBack="true"

and adding a async trigger to the UpdatePanel

 <asp:AsyncPostBackTrigger ControlID="PreviewReportBtn" EventName="Click" />