.Net For RealTime: Change Browse/Choose Text in Asp.Net FileUpload Control Awesome Tutorial Using CSS

Introduction:

While File Upload Control In Asp.net All Developers/Designers Suffering From To Change The Text Of Browse/Choose.In this Tutorial I will Resolve That Problem This is Tested Code Working Perfect.

In chrome/Mozilla Firefox

In Internet Explorer

I change Browse/Choose To Some Text . In My Tutorial I replaced With Upload Using Css :

Steps:

In .aspx Page Copy Paste This Code

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
/* File Upload Design */
.file-upload
{
display : inline-block;
overflow: hidden;
position: relative;
text-align: center;
vertical-align: middle;
/* Cosmetics */
border: 1px solid #5C005C;
background: #5C005C;
color: #fff;
/* browser can do it */
border-radius: 6px;
-moz-border-radius: 6px;
text-shadow: #000 1px 1px 2px;
-webkit-border-radius: 6px;
}

/* The button size */
.file-upload { height: 1.3em; }
.file-upload,.file-upload span { width: 3.5em; }

.file-upload input
{
position: absolute;
top: 0;
left: 0;
margin: 0;
font-size: 11px;
/* Loses tab index in webkit if width is set to 0 */
opacity: 0;
filter: alpha(opacity=0);
}

.file-upload strong { font: normal 12px Tahoma,sans-serif;text-align:center;vertical-align:middle; }

.file-upload span
{
position: absolute;
top: 0; left: 0;
display: inline-block;
/* Adjust button text vertical alignment */
padding-top: .15em;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<label class="file-upload">
<span><strong>Upload</strong></span>
<asp:FileUpload ID="FileUpload1" runat="server" Width="60px">
</asp:FileUpload>
</label>
</div>
</form>
</body>
</html>