tests/equal-heights.html at master · aioneframework/tests · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset=UTF-8>
	<title>Aioneframework.com</title>
	<meta name="theme-color" content="#168dc5">
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<meta name="description" content="Testing google fonts" >
	<link rel="icon" type="image/png" href="https://cdn.aioneframework.com/assets/images/favicon-32x32.png" sizes="32x32" />
    <link rel="stylesheet" type="text/css" href="https://cdn.aioneframework.com/assets/css/aione.min.css">

    <script src="http://manage.aioneframework.com/aioneframework/assets/js/vendor.js"></script>
    <script src="http://manage.aioneframework.com/aioneframework/assets/js/aione.js"></script>
    <style >
    .equal{
		padding:0 0 20px 0 ;
		border-bottom: 1px solid #e8e8e8;
    }
    .equal > *{
    	position: relative;
    }
    .equal > *{
		background: #454545;
		color:#FFFFFF;
		padding: 10px ;
		margin-bottom: 30px;
		margin-right: 30px;
    }
    </style>
</head>
<body class="bg-grey bg-lighten-3 pv-30 ph-10p">
	<div class="wrapper bg-white aione-align-center">
		<div class="aione-title">
			<h4 class="aione-align-center">div.ar > div.ac</h4>
		</div>
		<div class="ar equal columns-6">
			<!-- lorem10.ac*6 -->
			<div class="ac"><div>Lorem ipsum dolor sit amet</div></div>
			<div class="ac"><div>Consequuntur impedit error hic quo est nemo! Aperiam, laboriosam, ad.</div></div>
			<div class="ac"><div>Quis repellendus nam</div></div>
			<div class="ac"><div>A minus, neque quas modi sequi error reprehenderit quidem nam!</div></div>
			<div class="ac"><div>Veritatis ipsum maiores nostrum, magni quisquam similique esse sit tempora.</div></div>
			<div class="ac"><div>In impedit, nulla provident alias necessitatibus. Exercitationem recusandae, porro laborum.</div></div>
		</div>
		<div class="aione-title">
			<h4 class="aione-align-center">ul > li</h4>
		</div>
		<ul class="equal">
			<!-- lorem10.ac*6 -->
			<li>Lorem ipsum dolor <br>sit amet</li>
			<li>Consequuntur impedit <br>error hic quo est nemo! <br>Aperiam, laboriosam, ad.</li>
			<li>Quis repellendus nam</li>
			<li>A minus, neque quas modi sequi error reprehenderit quidem nam!</li>
			<li>Veritatis ipsum maiores nostrum, magni quisquam similique esse sit tempora.</li>
			<li>In impedit, <br>nulla provident alias necessitatibus. <br>Exercitationem recusandae, <br>porro laborum.</li>
		</ul>
	</div>
</body>