Advanced Search

css media queries for determining iphone orientation

/ Published in: Other
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. h1 {
  2. 	display: table-cell;
  3. 	vertical-align: middle;
  4. 	text-align: center;
  5. }
  6. h1 span { display: none; }
  7.  
  8. /* Portrait */
  9. @media screen and (max-width: 320px)
  10. {
  11. 	h1 span:nth-child(1) { display: inline; }
  12. }
  13.  
  14. /* Landscape */
  15. @media screen and (min-width: 321px)
  16. {
  17. 	h1 span:nth-child(2) { display: inline; }
  18. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.