File tree Expand file tree Collapse file tree 1 file changed +53
-0
lines changed Expand file tree Collapse file tree 1 file changed +53
-0
lines changed Original file line number Diff line number Diff line change @@ -81,4 +81,57 @@ To reorder two columns where column 1 has `size="9" push="3"` and column 2 has `
81
81
<ion-col size =" 3" order =" 1" >2</ion-col >
82
82
</ion-row >
83
83
</ion-grid >
84
+ ```
85
+ <h5 >Example 3: Push</h5 >
86
+ ``` html
87
+ <ion-grid >
88
+ <ion-row >
89
+ <ion-col size =" auto" push =" 1" >
90
+ <div >ion-col push 1</div >
91
+ </ion-col >
92
+ <ion-col size =" auto" push =" 1" >
93
+ <div >ion-col push 1</div >
94
+ </ion-col >
95
+ </ion-row >
96
+ </ion-grid >
97
+ ```
98
+ ** Version 9.x+**
99
+ ``` html
100
+ <ion-grid >
101
+ <ion-row >
102
+ <ion-col size =" auto" offset =" 1" >
103
+ <div >ion-col push 1</div >
104
+ </ion-col >
105
+ <ion-col size =" auto" >
106
+ <div >ion-col push 1</div >
107
+ </ion-col >
108
+ </ion-row >
109
+ </ion-grid >
110
+ ```
111
+
112
+ <h5 >Example 4: Push and Pull</h5 >
113
+ ``` html
114
+ <ion-grid >
115
+ <ion-row >
116
+ <ion-col size =" 3" size-md =" 6" push =" 9" push-md =" 6" >
117
+ <div >ion-col size="3" size-md="6" push="9" push-md="6"</div >
118
+ </ion-col >
119
+ <ion-col size =" 9" size-md =" 6" pull =" 3" pull-md =" 6" >
120
+ <div >ion-col size="9" size-md="6" pull="3" pull-md="6"</div >
121
+ </ion-col >
122
+ </ion-row >
123
+ </ion-grid >
124
+ ```
125
+ ** Version 9.x+**
126
+ ``` html
127
+ <ion-grid >
128
+ <ion-row >
129
+ <ion-col size =" auto" order =" 2" order-md =" 2" >
130
+ <div >ion-col size="3" size-md="6" order="9" order-md="6"</div >
131
+ </ion-col >
132
+ <ion-col size =" auto" order =" 1" order-md =" 1" >
133
+ <div >ion-col size="9" size-md="6" order="3" order-md="6"</div >
134
+ </ion-col >
135
+ </ion-row >
136
+ </ion-grid >
84
137
```
You can’t perform that action at this time.
0 commit comments