← Back to branch summary

~muffinresearch/griddles/trunk

« back to all changes in this revision

Viewing changes to css/expanded/griddles-mq.css

  • Committer: Stuart Colville
  • Date: 2012-06-20 23:20:45 UTC
  • Revision ID: git-v1:e5c20b7d9be5a7c3c7df8b0b015bb5baae85266f
provide 3rds as well as regular intervals

Show diffs side-by-side

added added

removed removed

Lines of Context:
css/expanded/griddles-mq.css
1
 
/* Mobile first media query set-up for IE < 9 and other UAs which don't support media queries */
2
 
.clearfix {
3
 
  overflow: hidden;
4
 
  *zoom: 1;
5
 
}
6
 
 
7
 
.grid {
8
 
  width: 100%;
9
 
}
10
 
 
11
 
.gp-cont, .gp-5, .gp-10, .gp-15, .gp-20, .gp-25, .gp-30, .gp-35, .gp-40, .gp-45, .gp-50, .gp-55, .gp-60, .gp-65, .gp-70, .gp-75, .gp-80, .gp-85, .gp-90, .gp-95, .gp-100 {
12
 
  display: block;
13
 
}
14
 
 
15
 
.gutter-gp-cont, .gutter .gp-cont, .gutter .gp-5, .gutter .gp-10, .gutter .gp-15, .gutter .gp-20, .gutter .gp-25, .gutter .gp-30, .gutter .gp-35, .gutter .gp-40, .gutter .gp-45, .gutter .gp-50, .gutter .gp-55, .gutter .gp-60, .gutter .gp-65, .gutter .gp-70, .gutter .gp-75, .gutter .gp-80, .gutter .gp-85, .gutter .gp-90, .gutter .gp-95, .gutter .gp-100 {
16
 
  padding: 5px;
17
 
}
18
 
 
19
 
/* Would be nice to use a variable here but
20
 
until SASS 3.2 it's not possible */
21
 
@media all and (min-width:480px) {
22
 
  .grid {
23
 
    letter-spacing: -0.31em;
24
 
    *letter-spacing: normal;
25
 
    word-spacing: -0.43em;
26
 
  }
27
 
 
28
 
  .gp-cont, .gp-5, .gp-10, .gp-15, .gp-20, .gp-25, .gp-30, .gp-35, .gp-40, .gp-45, .gp-50, .gp-55, .gp-60, .gp-65, .gp-70, .gp-75, .gp-80, .gp-85, .gp-90, .gp-95, .gp-100 {
29
 
    display: inline-block;
30
 
    vertical-align: top;
31
 
    letter-spacing: normal;
32
 
    word-spacing: normal;
33
 
    margin: 0;
34
 
    -moz-box-sizing: border-box;
35
 
    -webkit-box-sizing: border-box;
36
 
    -ms-box-sizing: border-box;
37
 
    box-sizing: border-box;
38
 
  }
39
 
 
40
 
  .gp-5 {
41
 
    width: 5%;
42
 
  }
43
 
 
44
 
  .gp-10 {
45
 
    width: 10%;
46
 
  }
47
 
 
48
 
  .gp-15 {
49
 
    width: 15%;
50
 
  }
51
 
 
52
 
  .gp-20 {
53
 
    width: 20%;
54
 
  }
55
 
 
56
 
  .gp-25 {
57
 
    width: 25%;
58
 
  }
59
 
 
60
 
  .gp-30 {
61
 
    width: 30%;
62
 
  }
63
 
 
64
 
  .gp-35 {
65
 
    width: 35%;
66
 
  }
67
 
 
68
 
  .gp-40 {
69
 
    width: 40%;
70
 
  }
71
 
 
72
 
  .gp-45 {
73
 
    width: 45%;
74
 
  }
75
 
 
76
 
  .gp-50 {
77
 
    width: 50%;
78
 
  }
79
 
 
80
 
  .gp-55 {
81
 
    width: 55%;
82
 
  }
83
 
 
84
 
  .gp-60 {
85
 
    width: 60%;
86
 
  }
87
 
 
88
 
  .gp-65 {
89
 
    width: 65%;
90
 
  }
91
 
 
92
 
  .gp-70 {
93
 
    width: 70%;
94
 
  }
95
 
 
96
 
  .gp-75 {
97
 
    width: 75%;
98
 
  }
99
 
 
100
 
  .gp-80 {
101
 
    width: 80%;
102
 
  }
103
 
 
104
 
  .gp-85 {
105
 
    width: 85%;
106
 
  }
107
 
 
108
 
  .gp-90 {
109
 
    width: 90%;
110
 
  }
111
 
 
112
 
  .gp-95 {
113
 
    width: 95%;
114
 
  }
115
 
 
116
 
  .gp-100 {
117
 
    width: 100%;
118
 
  }
119
 
}