Arry Arry - 15 days ago 4
ASP.NET (C#) Question

Adding an image and text both in asp.net button

I am looking for a solution where I will be able to add an image and text both in asp.net button.

<asp:Button ID="Button1" runat="server" Text="Button"/>


I am only able to specify text to the button, but how can I add an image as well to it?

Win Win
Answer

By default, ASP .Net doesn't have a button which can render both image and text at the same time. However, you can achieve in two ways.

Using CSS

I prefer CSS because it is light weight, and you can style it whatever you want.

enter image description here

<style type="text/css">
    .submit {
        border: 1px solid #563d7c;
        border-radius: 5px;
        color: white;
        padding: 5px 10px 5px 25px;
        background: url(https://i.stack.imgur.com/jDCI4.png) 
            left 3px top 5px no-repeat #563d7c;
    }
</style>

<asp:Button runat="server" ID="Button1" Text="Submit" CssClass="submit" />

Third Party Control

It works right out of the box. However, you cannot change their style easily.

enter image description here

Use third party control like Telerik RadButton.

Last but not least if you want, you can implement a custom server control by yourself.