The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Good breakpoints for responsive design?

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #245319

    I am quite new to attempting a responsive design (and very much a css amateur, as it is), so I am looking for some advice on media queries and break points.

    The layout in its current state can be seen at At the moment, it does okay down to around 1000 width, then various issues start cropping up. The design I based it on ( puts the breakpoint where it starts making columns 100% wide and stacking them at 480px which in hindsight doesn’t work so well for my design. I have too much content in the sidebars to allow them to squeeze down so far before rearranging things.

    However, I am very uncertain about what would be a good approach and what sort of minimum widths I should aim for before I collapse things. Obviously, I may need to change some of the sidebar or middle content to fit as well, once I know what to aim for.

    The header and menu are an issue I will need to tackle separately as they don’t really play nice at all currently. So this is mainly a query about the sidebars and the main content area.


    In short, you shouldn’t target a device size – you should define breakpoints for your own particular site/content; When things start to look rough, set a media query and fix it :)
    I think your thought process has already lead you to this logic anyway.

    There is a lot of material out there when you search for “best approach to responsive design”, but this site is pretty useful for getting it all in one place


    Thank you, Beverleyh. That helped me get the sense of where the basic breakpoints should be for my site (some of the inline content may need its own modifications). I am still a bit bothered by the amount of information that ends up before the main content when the left sidebar comes first, but it was never a site that could be full mobile first given the style of the content.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.