root / drupal7 / sites / all / themes / corolla / css / responsive.custom.css @ 74f6bef0
1 | 85ad3d82 | Assos Assos | /**
|
---|---|---|---|
2 | * responsive.custom.css is for custom media queries that are not set via the
|
||
3 | * theme settings, such as cascading media queries.
|
||
4 | *
|
||
5 | * By default all the other responsive stylesheets used in Adaptivetheme use a
|
||
6 | * "stacking method", however cascading media queries use a waterfall method so
|
||
7 | * you can leverage the cascade and inheritance for all browsers that support
|
||
8 | * media queries, regardless of screen size.
|
||
9 | *
|
||
10 | * @SEE http://zomigi.com/blog/essential-considerations-for-crafting-quality-media-queries/#mq-overlap-stack
|
||
11 | *
|
||
12 | * NOTE: this file loads by default, to disable got to your theme settings and
|
||
13 | * look under the "CSS" settings tab.
|
||
14 | */
|
||
15 | |||
16 | /* Some basic examples of cascading media queries. */
|
||
17 | |||
18 | /* Really small screens and up
|
||
19 | @media only screen and (min-width: 220px) {
|
||
20 | }
|
||
21 | */
|
||
22 | |||
23 | /* Smartphone sizes and up
|
||
24 | @media only screen and (min-width: 320px) {
|
||
25 | }
|
||
26 | */
|
||
27 | |||
28 | /* Smartphone sizes and down */
|
||
29 | @media only screen and (max-width: 480px) { |
||
30 | |||
31 | /*
|
||
32 | Float Region blocks example:
|
||
33 | In smaller screen sizes we can remove the float and widths so all blocks
|
||
34 | stack instead of displaying horizonally. The selector used here is an
|
||
35 | "attribute selector" which will match on any float block class. Use your
|
||
36 | inspector or Firebug to get the classes from the page output if you need
|
||
37 | more granular control over block alignment and stacking.
|
||
38 |
|
||
39 | "Float Region blocks" is an extension for floating blocks in regions, see
|
||
40 | your themes appearance settings, under the Extensions tab.
|
||
41 | */
|
||
42 | .region[class*="float-blocks"] .block { |
||
43 | float: none; |
||
44 | width: 100%; |
||
45 | } |
||
46 | |||
47 | } |
||
48 | |||
49 | /* Tablet sizes and up
|
||
50 | @media only screen and (min-width: 768px) {
|
||
51 | }
|
||
52 | */
|
||
53 | |||
54 | /* Desktops/laptops and up
|
||
55 | @media only screen and (min-width: 1025px) {
|
||
56 | }
|
||
57 | */ |