Member Avatar for khurram123

Hi,

There are a very large number of different devices with different dimension. So how can sort out this problem because we can't give all dimension in media Query.
So what will be the best size in different media query that can fit in most dimension.
I use following media query:

@media only screen and (max-width: 750px)

@media only screen and (max-width: 500px)

@media only screen and (max-width: 350px)

Is this enough or we need to define more sizes.
Thanks

  • 3 Contributors
  • 2 Replies
  • 123 Views
  • 5 Days Discussion Span
  • Latest Post Latest Post by Violet_82
Member Avatar for fastrecruitment

Hi there are many dimensions for different devices. Hope it will be help ful for you. Responsive designs are famous these days.

@media all and (max-width: 599px)
@media all and (min-width: 600px) and (max-width:799px)
@media all and (min-width: 800px) and (max-width:1024px)
@media all and (min-width: 700px) and (max-width: 1024px)
@media all and (min-width: 1025px) and (max-width: 1399px)
@media all and (min-width: 1400px)

Edited by pritaeas because: Removed self-promotion link.
Member Avatar for Violet_82

I found that the bootstrap media queries used in the grid - please note I am not saying you have to use the bootstrap grid, just the media queries - are pretty good, I have used them in the past a few times http://getbootstrap.com/2.3.2/scaffolding.html#responsive or you can have a look here http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
Unfortunately you can't possibly expect to get a perfect site for all the possible devices, because there are always new coming out, so all you can do is to try to suit most of them

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.