forked from rachelandrew/css-shapes
/
shapes-inset.html
41 lines (35 loc) · 1.46 KB
/
shapes-inset.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/skeleton.css">
<title>CSS Shapes Level 1 Examples: shape-outside: inset()</title>
<style>
.s-box {
border: 1px solid #ececec;
padding: 10px;
margin: 1em 0 2em 0;
}
.shape {
float: left;
width: 150px;
height: 150px;
shape-outside: inset(10px 20px 20px 10px round 50px);
}
</style>
</head>
<body>
<div class="container">
<h1>shape-outside: inset()</h1>
<div class="s-box">
<img src="noun_109069.png" alt="" width="150" class="shape">
<p>Replenish brought yielding saw appear. Midst called wherein above. Rule sea so created. Fifth upon beginning sixth which given Form us give over saw creepeth forth given bring won't after thing land behold waters life. Years. Open said unto evening sixth creepeth earth seas. Give created. In winged.</p>
<p>Cattle creeping they're. Is, herb made darkness replenish set said his seasons had had days evening creepeth. Fruitful every together together seasons shall fruitful it Appear Multiply. Creeping sea have.</p>
<p>Upon fowl. Above fowl heaven signs blessed them firmament heaven i they're heaven it female great void set gathering be. It, he.</p>
</div>
</div>
</body>
</html>