responsive design - Correct way of using @media query -


i want change height of banner on different screen sizes, using below snippet.

/* large devices, wide screens */ @media screen , (min-width : 1366px) {  }  /* medium devices, desktops */ @media screen , (min-width : 992px) {  }  /* small devices, tablets */ @media screen , (min-width : 768px) {  }  /* small devices, phones */  @media screen , (min-width : 480px) {  }  /* custom, iphone retina */  @media screen , (min-width : 320px) {  } 

but code creating problems, when change height of banner change bigger screens also.

now, googled , found different answers , viewpoints of people regarding media query snippet. below working me, fixed size , have seen people not using fixed ranges using max or min size only.

@media screen , (min-device-width : 340px) , (max-device-width : 355px) {} 

i want know correct , future-proof way of working media queries.?

refer below link , find media queries devices. that's correct way well.

https://css-tricks.com/snippets/css/media-queries-for-standard-devices/


Comments

Popular posts from this blog

java - UnknownEntityTypeException: Unable to locate persister (Hibernate 5.0) -

python - ValueError: empty vocabulary; perhaps the documents only contain stop words -

ubuntu - collect2: fatal error: ld terminated with signal 9 [Killed] -