What will be the maximum width of tablet to use in media query?

Question

I did some research on media queries and I am quite confused to get the tablet width.

Some examples I have found:

# Mobile
only screen and (min-width: 480px)

# Tablet
only screen and (min-width: 768px) 

# Desktop
only screen and (min-width: 992px)

# Huge
only screen and (min-width: 1280px) 

But, nowadays tablets sizes are vary. Some tablets looks very large, so how can I find the maximum width of tablet?

So far I used like below..

# Tablet
    only screen and (min-width: 768px) and (max-width: 979px)

I need to know the maximum tablet width to fix my responsive design. And can I use minimum width of 786px for tablet? I am asking for all branded tablet devices (Samsung, ipad, Google Nexus series)

Solution

What I am currently using.

   /* Smartphones (portrait and landscape) ----------- */
    @media only screen 
    and (min-device-width : 320px) 
    and (max-device-width : 480px) {
    /* Styles */
    }

    /* Smartphones (landscape) ----------- */
    @media only screen 
    and (min-width : 321px) {
    /* Styles */
    }

    /* Smartphones (portrait) ----------- */
    @media only screen 
    and (max-width : 320px) {
    /* Styles */
    }

    /* Tablet (portrait and landscape) ----------- */
    @media only screen 
    and (min-device-width : 768px) 
    and (max-device-width : 1024px) {
    /* Styles */
    }

    /* Tablet (landscape) ----------- */
    @media only screen 
    and (min-device-width : 768px) 
    and (max-device-width : 1024px) 
    and (orientation : landscape) {
    /* Styles */
    }

    /* Tablet (portrait) ----------- */
    @media only screen 
    and (min-device-width : 768px) 
    and (max-device-width : 1024px) 
    and (orientation : portrait) {
    /* Styles */
    }

    /* Desktops and laptops ----------- */
    @media only screen 
    and (min-width : 1224px) {
    /* Styles */
    }

    /* Large screens ----------- */
    @media only screen 
    and (min-width : 1824px) {
    /* Styles */
    }

    /* iPhone 4 ----------- */
    @media
    only screen and (-webkit-min-device-pixel-ratio : 1.5),
    only screen and (min-device-pixel-ratio : 1.5) {
    /* Styles */
    }

Comments

[UI_Dev]

So for tablet min-width - 767px and max-width - 979px right?

[UI_Dev]

This maximum width 979px is applicable for landscape mode?

[GibboK]

@DineshKumar I had a look at a past project, I have edited my answer. Now you have listed portrait and landscape dimension. I hope it helps :-)

[GibboK]

@DineshKumar glad to help! :-)