Skip to content

Instantly share code, notes, and snippets.

Revisions

  1. ajaxray revised this gist Aug 18, 2012. 2 changed files with 0 additions and 0 deletions.
    File renamed without changes.
  2. ajaxray revised this gist Aug 18, 2012. 1 changed file with 18 additions and 0 deletions.
    18 changes: 18 additions & 0 deletions CSS Media query and conditional styles
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,18 @@
    /* Media query and conditional styles
    *---------------------------------------------*/

    /*styles for 800px and up!*/
    @media only screen and (min-width: 800px) {
    body{background-color: #666; }
    #container{width: 320px; min-height: 460px; background-color: #fff; margin: 0px auto 60px;}
    }/*/mediaquery*/


    /* iPhone 4, Opera Mobile 11 and other high pixel ratio devices ----------- */
    @media
    only screen and (-webkit-min-device-pixel-ratio: 1.5),
    only screen and (-o-min-device-pixel-ratio: 3/2),
    only screen and (min--moz-device-pixel-ratio: 1.5),
    only screen and (min-device-pixel-ratio: 1.5) {
    #container{background-color: #fff; margin: 0 auto; padding-bottom: 60px}
    }
  3. ajaxray renamed this gist Aug 18, 2012. 1 changed file with 0 additions and 19 deletions.
    19 changes: 0 additions & 19 deletions gistfile1.css → CSS3 Gradient Button
    Original file line number Diff line number Diff line change
    @@ -23,22 +23,3 @@ a.button{
    background: -ms-linear-gradient(top, #bf3b4a, #8c2b36);
    background: -o-linear-gradient(top, #bf3b4a, #8c2b36);
    }

    /* Media query and conditional styles
    *---------------------------------------------*/

    /*styles for 800px and up!*/
    @media only screen and (min-width: 800px) {
    body{background-color: #666; }
    #container{width: 320px; min-height: 460px; background-color: #fff; margin: 0px auto 60px;}
    }/*/mediaquery*/


    /* iPhone 4, Opera Mobile 11 and other high pixel ratio devices ----------- */
    @media
    only screen and (-webkit-min-device-pixel-ratio: 1.5),
    only screen and (-o-min-device-pixel-ratio: 3/2),
    only screen and (min--moz-device-pixel-ratio: 1.5),
    only screen and (min-device-pixel-ratio: 1.5) {
    #container{background-color: #fff; margin: 0 auto; padding-bottom: 60px}
    }
  4. ajaxray revised this gist Jun 26, 2012. No changes.
  5. ajaxray revised this gist Jun 26, 2012. 1 changed file with 20 additions and 1 deletion.
    21 changes: 20 additions & 1 deletion gistfile1.css
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,5 @@
    /*
    * Small snippets of useful css tricks
    * Small (collected) snippets of useful css tricks
    *
    * @author: Anis uddin Ahmad <[email protected]>
    * @link : http://ajaxray.com
    @@ -22,4 +22,23 @@ a.button{
    background: -moz-linear-gradient(top, #bf3b4a, #8c2b36);
    background: -ms-linear-gradient(top, #bf3b4a, #8c2b36);
    background: -o-linear-gradient(top, #bf3b4a, #8c2b36);
    }

    /* Media query and conditional styles
    *---------------------------------------------*/

    /*styles for 800px and up!*/
    @media only screen and (min-width: 800px) {
    body{background-color: #666; }
    #container{width: 320px; min-height: 460px; background-color: #fff; margin: 0px auto 60px;}
    }/*/mediaquery*/


    /* iPhone 4, Opera Mobile 11 and other high pixel ratio devices ----------- */
    @media
    only screen and (-webkit-min-device-pixel-ratio: 1.5),
    only screen and (-o-min-device-pixel-ratio: 3/2),
    only screen and (min--moz-device-pixel-ratio: 1.5),
    only screen and (min-device-pixel-ratio: 1.5) {
    #container{background-color: #fff; margin: 0 auto; padding-bottom: 60px}
    }
  6. ajaxray revised this gist Jun 26, 2012. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion gistfile1.css
    Original file line number Diff line number Diff line change
    @@ -8,7 +8,7 @@
    /* CSS Gradient button
    *---------------------------------*/

    a.button.text{
    a.button{
    background-color: #AB3645;
    border-radius: 6px;
    border: 1px outset #AB3645;
  7. ajaxray created this gist Jun 26, 2012.
    25 changes: 25 additions & 0 deletions gistfile1.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,25 @@
    /*
    * Small snippets of useful css tricks
    *
    * @author: Anis uddin Ahmad <[email protected]>
    * @link : http://ajaxray.com
    */

    /* CSS Gradient button
    *---------------------------------*/

    a.button.text{
    background-color: #AB3645;
    border-radius: 6px;
    border: 1px outset #AB3645;
    display: inline-block;
    padding: 0 20px; margin: 5px;
    font-weight: bold;
    box-shadow: 1px 1px 2px #777;

    /* Create gradient background */
    background: -webkit-linear-gradient(top, #bf3b4a, #8c2b36);
    background: -moz-linear-gradient(top, #bf3b4a, #8c2b36);
    background: -ms-linear-gradient(top, #bf3b4a, #8c2b36);
    background: -o-linear-gradient(top, #bf3b4a, #8c2b36);
    }