Wednesday, September 4, 2013

How To Add CSS Rules For iPad/iPhone With Orientation And Add CSS Hack For IE10

1. Add CSS Rules For iPad With Orientation
You can add special css rules for iPhone/iPad for your website in css.
See below 
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) { 
 /* Add your css rules/hack for iPhone/iPad portrait */ 
} 
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) { 
   /* Add your css rules/hack for iPhone/iPad landscape */ 
}

2. IE 10 CSS Hack
.ie10 .yourcss{
  /* Add your css hack for IE10 */
}

Add this script in head section of the web page, this append a class of ie10 to <html> tag.
<!--[if !IE]><!-->
        <script type="text/javascript">
                            if (/*@cc_on!@*/false) {
                                document.documentElement.className += ' ie10';
                            }  
        </script>
<!--<![endif]--> 

This hack(class) work with IE 10 because IE 10 put a class (class="ie10") to the HTML tag (<html>). We can easily add hack for IE 10 using this. You can find this in your web page contents in IE 10. 
eg. <html class="ie10" xmlns="http://www.w3.org/1999/xhtml">

No comments:

Post a Comment