Put image icon inside TextBox using CSS

Last Reply one year ago By dharmendr

Posted one year ago

Please any example on how to put image icon inside textbox


 <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>


You are viewing reply posted by: dharmendr one year ago.
Posted one year ago

Hi micah,

Refer the below sample. You can use background image to display the image inside the textbox or simply apply the css to display an image inside the textbox.


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <style type="text/css">
            position: relative;
            width: 240px;
        .dvImageTextBox input
            border: none: background:#fff;
            display: block;
            width: 100%;
            box-sizing: border-box;
        .dvImageTextBox img
            position: absolute;
            top: 2px;
            right: 5px;
            background: #FFFFFF url('http://icons.iconarchive.com/icons/gakuseisean/ivista-2/16/Start-Menu-Search-icon.png') no-repeat top right;
    <div class="dvImageTextBox">
        <input name="TextBox1" type="text" id="TextBox1" />
        <img src="http://icons.iconarchive.com/icons/gakuseisean/ivista-2/16/Start-Menu-Search-icon.png"
            height="17px" width="25px" />
    <input type="text" id="name" class="inputImage" />