how do i add bootstrap image inside a mvc actionlink syntax?

Question

I'm having following code for a group button

<div ><span class="font-icon-group">
@Html.ActionLink("Group button", "Index", "Groups",null ,new {@class="btn", @id="A" })
</div>

but this is wrong as font-icon-group is coming outside Group button.

How can i take it inside button please guide me (mvc syntax code need a change -above code).

with plain html it is working fine code for html is following :

<div>
<a class="btn" href="#" id="A1"><span class="font-icon-group"></span> All Groups</a></div>

please guide to change syntax in mvc.

Answer 1

Use Url.Action and format the HTML however you want.

<div>
  <a class="btn" href="@Url.Action("Index", "Groups")" id="A1">
    <span class="font-icon-group"></span> All Groups
  </a>
</div>

I prefer to use partial views and templates instead of HTML-generating helpers, especially when working within a framework like Bootstrap.