View difference between Paste ID: <a href="/zf041az9">zf041az9</a> and <a href="/Sn5tALjV">Sn5tALjV</a>

<!DOCTYPE html>
1		<!DOCTYPE html>
2		<html lang="en">
3		<head>
4		<meta charset="UTF-8">
5		<title>Jefrey gay</title>
6		</head>
7		<body>
8
9		<style>
10		*{
11		font: 14px 'Arial', Times;
12		}
13		body,html,
14		.container{
15		height: 100%;
16		}
17
18		.item{
19		height: 50%;
20		width: 50%;
21		float: left;
22		position: relative;
23		display: table;
24		}
25
26		.item img{
27		height: 100%;
28		position: absolute;
29		z-index:1;
30		top: 0;
31		left:0;
32		}
33
34		.item .middle{
35		display: table-cell;
36		vertical-align:middle;
37		z-index: 9;
38		text-align: center;
39		position: relative;
40		}
41
42		h1{
43		font-size: 40px;
44		font-weight: bolder;
45		}
46		p{
47		font-size: 20px;
48		}
49
50		</style>
51
52		<div class="container">
53
54		<!-- item -->
55		<div class="item">
56		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
57		<div class="middle">
58		<div class="reset">
59		<h1>1</h1>
60		<p>Fulano</p>
61		</div>
62		</div>
63		</div>
64		<!-- /item -->
65
66
67		<!-- item -->
68		<div class="item">
69		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
70		<div class="middle">
71		<div class="reset">
72		<h1>1</h1>
73		<p>Fulano</p>
74		</div>
75		</div>
76		</div>
77		<!-- /item -->
78
79
80		<!-- item -->
81		<div class="item">
82		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
83		<div class="middle">
84		<div class="reset">
85		<h1>1</h1>
86		<p>Fulano</p>
87		</div>
88		</div>
89		</div>
90		<!-- /item -->
91
92
93		<!-- item -->
94		<div class="item">
95		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
96		<div class="middle">
97		<div class="reset">
98		<h1>1</h1>
99		<p>Fulano</p>
100		</div>
101		</div>
102		</div>
103		<!-- /item -->
104
105
106		<!-- item -->
107		<div class="item">
108		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
109		<div class="middle">
110		<div class="reset">
111		<h1>1</h1>
112		<p>Fulano</p>
113		</div>
114		</div>
115		</div>
116		<!-- /item -->
117
118
119		<!-- item -->
120		<div class="item">
121		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
122		<div class="middle">
123		<div class="reset">
124		<h1>1</h1>
125		<p>Fulano</p>
126		</div>
127		</div>
128		</div>
129		<!-- /item -->
130
131
132		<!-- item -->
133		<div class="item">
134		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
135		<div class="middle">
136		<div class="reset">
137		<h1>1</h1>
138		<p>Fulano</p>
139		</div>
140		</div>
141		</div>
142		<!-- /item -->
143
144
145		<!-- item -->
146		<div class="item">
147		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
148		<div class="middle">
149		<div class="reset">
150		<h1>1</h1>
151		<p>Fulano</p>
152		</div>
153		</div>
154		</div>
155		<!-- /item -->
156
157
158		<!-- item -->
159		<div class="item">
160		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
161		<div class="middle">
162		<div class="reset">
163		<h1>1</h1>
164		<p>Fulano</p>
165		</div>
166		</div>
167		</div>
168		<!-- /item -->
169
170
171		<!-- item -->
172		<div class="item">
173		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
174		<div class="middle">
175		<div class="reset">
176		<h1>1</h1>
177		<p>Fulano</p>
178		</div>
179		</div>
180		</div>
181		<!-- /item -->
182
183
184		<!-- item -->
185		<div class="item">
186		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
187		<div class="middle">
188		<div class="reset">
189		<h1>1</h1>
190		<p>Fulano</p>
191		</div>
192		</div>
193		</div>
194		<!-- /item -->
195
196
197		<!-- item -->
198		<div class="item">
199		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
200		<div class="middle">
201		<div class="reset">
202		<h1>1</h1>
203		<p>Fulano</p>
204		</div>
205		</div>
206		</div>
207		<!-- /item -->
208
209
210
211		<!-- item -->
212		<div class="item">
213		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
214		<div class="middle">
215		<div class="reset">
216		<h1>1</h1>
217		<p>Fulano</p>
218		</div>
219		</div>
220		</div>
221		<!-- /item -->
222
223
224		<!-- item -->
225		<div class="item">
226		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
227		<div class="middle">
228		<div class="reset">
229		<h1>1</h1>
230		<p>Fulano</p>
231		</div>
232		</div>
233		</div>
234		<!-- /item -->
235
236
237
238		<!-- item -->
239		<div class="item">
240		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
241		<div class="middle">
242		<div class="reset">
243		<h1>1</h1>
244		<p>Fulano</p>
245		</div>
246		</div>
247		</div>
248		<!-- /item -->
249
250
251
252
253		<!-- item -->
254		<div class="item">
255		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
256		<div class="middle">
257		<div class="reset">
258		<h1>1</h1>
259		<p>Fulano</p>
260		</div>
261		</div>
262		</div>
263		<!-- /item -->
264
265
266
267		<!-- item -->
268		<div class="item">
269		<img src="http://i.imgur.com/YoGr2Bd.png" alt="">
270		<div class="middle">
271		<div class="reset">
272		<h1>1</h1>
273		<p>Fulano</p>
274		</div>
275		</div>
276		</div>
277		<!-- /item -->
278
279
280
281
282
283		</div>
284
285
286
287		</body>
288		</html>