min-width = 481 why

Question

I saw some pages with @media that their min-width is set to 481px.
Why? What is 481 for?
I think ipad size is 768*1024 .
Thanks.

    @media only screen and (device-width: 768px) {
  /* For general iPad layouts */
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
}

Its for iphone? So can i set the min-width to 768 just for ipad? — user2207044, Mar 25 '13 at 17:55

score 0 · Accepted Answer · answered Mar 25 '13 at 17:57

0

Its because people also define media queries for smartphones. There is the width = 480px most of the time.

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {}    }

so the next higher resolution will be min-device-width = 481px

hope this helps for more information look at http://css-tricks.com/snippets/css/media-queries-for-standard-devices/

answered Mar 25 '13 at 17:57

Denny Mueller

3,505
5
36
67

481 is for iphone am I rigth? can I set the min-width to 768 for ipad sites? – user2207044 Mar 25 '13 at 17:59
1

@user2207044 other devices exist besides iThings. – Diego Agulló Mar 25 '13 at 18:47

min-width = 481 why

1 Answers1