Media Query for responsive site – Complete list of media query

media-query-for-responsive-site-complete-list-of-media-query

Now days, we are working on responsive site. Everyone is looking for simple  responsive site. Here, I am writing all media queries for  your responsive site.

Please see the complete list of media query.

/* SmartPhones -------- */
@media only screen and (max-width : 481px) and (min-width : 321px) {
/* CSS HERE */
}
/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
/* CSS HERE */
}
/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
/* CSS HERE */
}
/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/* CSS HERE */
}
/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
/* CSS HERE */
}
/* Desktops and laptops ----------- */
@media only screen and (min-width : 1224px) {
/* CSS HERE */
}
/* Large screens ----------- */
@media only screen and (min-width : 1824px) {
/* CSS HERE */
}
/* iPhone 4 ----------- */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {
/* CSS HERE */
}

Please use above list to improve your responsive site.

This entry was posted in Development and tagged , , , . Bookmark the permalink.

One Response to Media Query for responsive site – Complete list of media query

  1. ankush says:

    Hi ,

    I have one doubt in drupal 7 regarding rendering DB on template file which come from module file through theme function.

    I am using this in theme function of module file

    ‘expenses_list_template’ => array(
    ‘variables’ => array(‘result’ => array()),
    ‘path’ => drupal_get_path(‘theme’, ‘bartik’) . ‘/templates’,
    ‘template’ => ‘myexpenses_list’,
    ‘arguments’ => array(),
    ),
    );
    and then

    function expenses_list() {
    $result = db_query(“select * from {expense_insert}”);
    return theme(‘expenses_list_template’);
    }

    in module file itself

    and I am writing

    on
    myexpenses_list.tpl.php

    I am getting blank page with some text which I have written in myexpenses_list.tpl.php,but not able to fetch the Db list,is there any thing I need to add on this function
    function expenses_list()

    Thanks

Leave a Reply

Your email address will not be published. Required fields are marked *

Human Verification: In order to verify that you are a human and not a spam bot, please enter the answer into the following box below based on the instructions contained in the graphic.