Conditional CSS or browser based CSS



Conditional CSS or browser based CSS

1.       Browser for CSS
·         'IE' - Internet Explorer
·         'Gecko' - Gecko based browsers (Firefox, Camino etc)
·         'Webkit' - Webkit based browsers (Safari, Chrome, Shiira etc)
·         'SafMob' - Mobile Safari (iPhone / iPod Touch)
·         'Opera' - Opera's browser
·         'IEMac' - Internet Explorer for the Mac
·         'Konq' - Konqueror
·         'IEmob' - IE mobile
·         'PSP' - Playstation Portable
·         'NetF' - Net Front
2.       Condition - arithmetic operator
·         lt - Less than
·         lte - Less than or equal to
·         eq - Equal to
·         gte - Greater than or equal to
·         gt - Greater then
Example:
              Conditional CSS syntax
 [if IE] - Used if the browser is IE  
 [if Gecko] - Used if the browser is not Firefox
 [if IE 5] - Used if browser is IE 5  
 [if lte IE 6] - Used if the browser is IE 6 or less (IE 5, IE 4 etc)  
 [if gt IE 6] - Used if the browser is IE 6 or grater
How to use it
1.  <!--[if IE]>
.backTable
       {
              margin-top: -185px!important;
       }
<![endif]-->
2.  <!--[if IE]>
<link rel="stylesheet" type="text/css" href="IE_CSS.css" />
<![endif]-->
3.  <style>
.backTable td span
           {
              display:none;
              position:absolute;
              margin-top:-175px;
              -webkit-margin-before:-185px;
              margin-left:100px;
           }
           .icon
           {
  display: -moz-inline-box;
 
            }

  </style>
Note: webkit,Gecko etc does not support all style. Please find out supported style.

Comments

Post a Comment

Popular posts from this blog

Display multiple marker point on Google Map with same location or same Longitude,Latitude

 Display multiple marker point on Google Map with same location or same Longitude, Latitude <!DOCTYPE html> <html> <head>     <title>Google Map</title> <!-- For Google Map Style Sheet--> <style type="text/css">     #map_canvas     {         height: 450px;         width: 980px;     }     .infowindow     {         font-size: 12px;         width: 200px !important;         font-family: verdana;     }     @media print     {         #map_canvas         {             height: 950px;         }     } </style> <!-- For Google Map--> <script src="http://maps.google.com/maps/api/js?v=3.7&amp;sensor=false" type="text/javascript"></script> <!--downlaod the oms.min.js javascript file from https://github.com/jawj/OverlappingMarkerSpiderfier --> <script src="JS/oms.min.js" type="text/javascript"></script> <script type="text/java
Read more

Implementing Zoom functionality in asp.net

Zoom functionality in asp.net 1. Write the Below code in the  <head> Tag  <script type="text/javascript">         function BrowserZoomPluse() {            nzoom = parseInt(divTest.style.zoom) + 30 + '%';             divTest.style.zoom = nzoom ;         }         function BrowserZoomMinuse() {             nzoom = parseInt(divTest.style.zoom) - 10 + '%';             divTest.style.zoom = nzoom ;         }         function ResetZoom() {             nzoom = parseInt(divTest.value);             divTest.style.zoom = '100%';         }     </script> 2. Add the below Code inside the <body> tag <div id="divTest" style="zoom: 100%">         <div class="textsize">          <a  href="javascript:void(0);" onclick="BrowserZoomPluse();">                 Zoom + </a>                  <a  href="javascript:void(0);" onclick="BrowserZoom
Read more

Check Session Timeot for Whole Application

1. Create a BasePage.cs in App_Code  and write the following code         protected void Page_Init(object sender, EventArgs e)         {             if (Context.Session != null)             {                 if (Session.IsNewSession)                 {                     HttpCookie newSessionIdCookie = Request.Cookies["ASP.NET_SessionId"];                     if (newSessionIdCookie != null)                     {                         string newSessionIdCookieValue = newSessionIdCookie.Value;                         if (newSessionIdCookieValue != string.Empty)                         {                             //This means Session was timed Out and New Session was started                             Response.Redirect("Home.aspx");                         }                     }                 }             }         } 2. Inherit this basepage on all the aspx pages such as using System; using System.Collections.Generic; using System.Col
Read more