title: How do you get an asp.net hyperlink control to navigate to a URL when clicked around the text?
body: <p>I have two options for the user on  my page, one is a button that performs an edit function and the other is a hyperlink that navigates to another page. Both are styled to look the same but because the delete option is a hyperlink control it only works when you click on the text and not the surrounding box like the button does.</p>
  
  <p><img src="https://i.stack.imgur.com/U9dZ3.jpg" alt="Two option buttons"></p>
  
  <p>The .aspx file is as follows:</p>
  
  <pre><code>&lt;asp:Button ID="EditButton" runat="server" CommandName="Edit" Text="Edit"/&gt;                  
  &lt;div class ="deletebutton"&gt;
  &lt;asp:HyperLink ID="HyperLinkDeleteRecord" runat="server" NavigateUrl='&lt;%#"DeleteArticle.aspx?passarticleid=" + Eval("ArticleID") %&gt;'&gt;Delete&lt;/asp:HyperLink&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And the CSS is:</p>
  
  <pre><code>.deletebutton, input[type="submit"] 
  {
  align-items: flex-start;
  text-align: center;
  cursor: default;
  color:#BD193A;
  padding: 2px 6px 3px;
  border: 2px outset buttonface;
  border-image-source: initial;
  border-image-slice: initial;
  border-image-width: initial;
  border-image-outset: initial;
  border-image-repeat: initial;
  background-color: buttonface;
  box-sizing: border-box;
  -webkit-appearance: push-button;
  -webkit-user-select: none;
  white-space: pre;
  width: 200px;
  font: 11px/1.75em Verdana, Tahoma, arial, sans-serif;
  float: left;
  margin:5px;
  }
  </code></pre>