How to Make Server Controls Browser Compatible Using ASP.NET

Introduction

In modern web development, we need to check the browser compatibility for our web pages. This can include changing the css styles for design issues. Using ASP.NET we can check the browser compatibility without writing a single line of code for the server controls.

Let's check out some code samples:
If we will define css classes like:
.IEStyle{color:Red;}
.FFStyle{color:Blue;}
.DefaultStyle{color:Black;}

Create a Label control in your page.
Label control:

<asp:Label ID="lblTest" runat="server" ie:CssClass="IEStyle"

mozilla:CssClass="FFStyle" CssClass="DefaultStyle" ie:Text="You are in Internet 

explorer." mozilla:Text="You are in Firefox." Text="You are in other browser." 

/>

Just make page run in the different browser and see the changes as below
Output:
IE  : You are in Internet explorer.
FF : You are in Firefox.
Others : You are in other browser.

You can try the same with the TextBox control.
TextBox Control:

<asp:TextBox ID="TestTextBox" runat="server" ie:Text="You are in Internet explorer."  
mozilla:Text="You are in Firefox." Text="You are in other browser." ie:CssClass="IEStyle"  
mozilla:CssClass="FFStyle" 
CssClass="DefaultStyle" />
 

We can use these setting for all server controls.
For adding different css files for different browsers use the following;

<link runat="server" href="~/Styles/Site.css" mozilla:href="~/MOZStyleSheet.css"ie:href="~/IEStyleSheet.css" rel="stylesheet" type="text/css" />

 

Flickr Tags: ASP.NET,asp.net contols,has code