Skip to content

Instantly share code, notes, and snippets.

@1Caxz
Forked from gokulkrishh/media-query.css
Created April 22, 2020 16:32
Show Gist options
  • Save 1Caxz/8896cdd248999ea677b5bb29583569dc to your computer and use it in GitHub Desktop.
Save 1Caxz/8896cdd248999ea677b5bb29583569dc to your computer and use it in GitHub Desktop.

Revisions

  1. @gokulkrishh gokulkrishh revised this gist Oct 28, 2015. 1 changed file with 5 additions and 5 deletions.
    10 changes: 5 additions & 5 deletions media-query.css
    Original file line number Diff line number Diff line change
    @@ -12,7 +12,7 @@

    /*
    ##Device = Laptops, Desktops
    ##Screen = B/w 1024px to 1280px
    ##Screen = B/w 1025px to 1280px
    */

    @media (min-width: 1025px) and (max-width: 1280px) {
    @@ -23,7 +23,7 @@

    /*
    ##Device = Tablets, Ipads (portrait)
    ##Screen = B/w 768px to 1023px
    ##Screen = B/w 768px to 1024px
    */

    @media (min-width: 768px) and (max-width: 1024px) {
    @@ -34,7 +34,7 @@

    /*
    ##Device = Tablets, Ipads (landscape)
    ##Screen = B/w 768px to 1023px
    ##Screen = B/w 768px to 1024px
    */

    @media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    @@ -44,7 +44,7 @@
    }

    /*
    ##Device = Tablets, Mobiles (Landscape)
    ##Device = Low Resolution Tablets, Mobiles (Landscape)
    ##Screen = B/w 481px to 767px
    */

    @@ -55,7 +55,7 @@
    }

    /*
    ##Device = Most of Mobiles (Portrait)
    ##Device = Most of the Smartphones Mobiles (Portrait)
    ##Screen = B/w 320px to 479px
    */

  2. @gokulkrishh gokulkrishh revised this gist Oct 28, 2015. 1 changed file with 0 additions and 1 deletion.
    1 change: 0 additions & 1 deletion media-query.css
    Original file line number Diff line number Diff line change
    @@ -10,7 +10,6 @@

    }


    /*
    ##Device = Laptops, Desktops
    ##Screen = B/w 1024px to 1280px
  3. @gokulkrishh gokulkrishh revised this gist Oct 28, 2015. 1 changed file with 14 additions and 3 deletions.
    17 changes: 14 additions & 3 deletions media-query.css
    Original file line number Diff line number Diff line change
    @@ -16,18 +16,29 @@
    ##Screen = B/w 1024px to 1280px
    */

    @media (min-width: 1024px) and (max-width: 1280px) {
    @media (min-width: 1025px) and (max-width: 1280px) {

    //CSS

    }

    /*
    ##Device = Laptops, Tablets
    ##Device = Tablets, Ipads (portrait)
    ##Screen = B/w 768px to 1023px
    */

    @media (min-width: 768px) and (max-width: 1023px) {
    @media (min-width: 768px) and (max-width: 1024px) {

    //CSS

    }

    /*
    ##Device = Tablets, Ipads (landscape)
    ##Screen = B/w 768px to 1023px
    */

    @media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

    //CSS

  4. @gokulkrishh gokulkrishh created this gist Oct 28, 2015.
    56 changes: 56 additions & 0 deletions media-query.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,56 @@

    /*
    ##Device = Desktops
    ##Screen = 1281px to higher resolution desktops
    */

    @media (min-width: 1281px) {

    //CSS

    }


    /*
    ##Device = Laptops, Desktops
    ##Screen = B/w 1024px to 1280px
    */

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

    //CSS

    }

    /*
    ##Device = Laptops, Tablets
    ##Screen = B/w 768px to 1023px
    */

    @media (min-width: 768px) and (max-width: 1023px) {

    //CSS

    }

    /*
    ##Device = Tablets, Mobiles (Landscape)
    ##Screen = B/w 481px to 767px
    */

    @media (min-width: 481px) and (max-width: 767px) {

    //CSS

    }

    /*
    ##Device = Most of Mobiles (Portrait)
    ##Screen = B/w 320px to 479px
    */

    @media (min-width: 320px) and (max-width: 480px) {

    //CSS

    }