In my experience most responsive websites don't have min-widths so when resized to a tiny size (say a 100px window) the content screws itself up and becomes illegible.

example: http://alistapart.com/article/responsive-web-design

I love the flexibility of RWD but usually implement a min-width on my sites as I don't like the site presentation when it gets too small. A lot of sites which aren't responsive let you scroll and I was wondering if it would be a good compromise to have a min-width and whether it effects usability at all. examples https://theartofdining.co.uk/

3 Answers 3


Web design has always been about choosing an audience you care about. You could care about every single browser in use and either rely on the minimal set of common functionality or use progressive-enhancement/graceful-degradation techniques to take advantage of modern functionality where it's available. The later approach takes much resources.

Personally I only worry about devices with 320px width or greater. In a sense I don't care much about smaller devices, although I expect sites I make to have some (possibly reduced) functionality in every browser.

  • I think it might be a little bit of anal web designer problem where I find myself resizing pages to see how they react... in real life Im sure they dont do this
    – benbyford
    Commented Jul 10, 2013 at 15:08
  • @benbyford - I do that too. A quick smooth transition is pleasing to me, if not that significant to most real users. Anal? Possibly, but I am what I am. ;)
    – obelia
    Commented Jul 10, 2013 at 15:37
  • I often drag browser window to make it smaller so I can see another window(s). Some sites can't handle it. Commented Jul 20, 2018 at 1:45
  • @benbyford Most users obviously won't do this, but that's a really good habit; it's good to see how pages look at different widths Commented Apr 26 at 0:23

First: You can have a great responsive site loaded with min-widths or max-widths or even mix them up in the same media rule. People have different approaches when writing a responsive style sheet.

Having your media-queries all written with:

@media screen and (min-width: 320px) {
@media screen and (min-width: 680px) {
@media screen and (min-width: 1024px) {

Means that this CSS will apply if the viewing area is greater than 320, 680 and 1024 respectively.

Altough if you have:

@media screen and (max-width: 320px) {
@media screen and (max-width: 680px) {
@media screen and (max-width: 1024px) {

Means that this CSS will apply if the viewing area is smaller than 320, 680 and 1024.

Second: You can even have a more specific media-querie saying:

@media screen and (min-width: 680px) and (max-width: 1024px) {

which states: If the viewing area is between 680px and 1024px those styles will apply.

Wrapping it up, if you don't see many web sites with min-width media-queries it doesn't mean they don't work as good as the max-width ones. They do, maybe the person who wrote the responsive bit was more confortable using max-width.


  • Are those numbers (320, 680 and 1024) what I should work with to make responsive design?
    – Steve
    Commented Jan 11, 2017 at 21:27
  • @Jessica From what I can gather, there are many different options depending on how specific you would like to be with screen sizes - check out the "Breakpoints" section of this page for some examples.
    – Unencoded
    Commented Mar 18, 2017 at 2:12
  • I know this was written 10 years ago, but I think media queries should be a last resort now that all major browsers support responsive layouts like flexbox and grid - it really simplifies the design Commented Apr 26 at 0:29

Wether or not it's going to affect usability depends on your audience, the device they're using, and what you've decided on for a minimum width.

Most smart phones allow you to scroll and zoom, so you may want to set your minimum width to whatever the lowest width is that won't hinder your content. However, the whole purpose of responsive design is to be able to change your layout at different widths, allowing you to fit content in. You should be able to find some layout solution for nearly all sizes, unless large images or charts are part of your content.

Either way, I generally don't worry too much about widths below 320px, and it seems neither do most web designers.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.