-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbox.html
82 lines (79 loc) · 2.6 KB
/
box.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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="css/boxCss.css" />
<title>Document</title>
<style>
* {
box-sizing: border-box;
}
.input-wrap {
height: 32px;
width: 150px;
overflow: hidden;
padding: 2px;
}
input {
outline: none;
width: 100%;
height: 100%;
background-color: red;
border: 2px solid wheat;
box-shadow: 0 0 0 2px rgba(0, 0, 0, 1);
}
.test {
background: black;
color: white;
width: 200px;
height: 300px;
}
.test span {
display: flex;
flex-direction: column;
}
</style>
</head>
<body>
<div class="test">
<span
>das das das das das dasd ajsd akjsnd asndlk asmdlk asldk maslkd aslkd
aslk daslmd lkasd das das das das das dasd ajsd akjsnd asndlk asmdlk
asldk maslkd aslkd aslk daslmd lkasd das das das das das dasd ajsd
akjsnd asndlk asmdlk asldk maslkd aslkd aslk daslmd lkasd das das das
das das dasd ajsd akjsnd asndlk asmdlk asldk maslkd aslkd aslk daslmd
lkasd das das das das das dasd ajsd akjsnd asndlk asmdlk asldk maslkd
aslkd aslk daslmd lkasd </span
><span
>das das das das das dasd ajsd akjsnd asndlk asmdlk asldk maslkd aslkd
aslk daslmd lkasd das das das das das dasd ajsd akjsnd asndlk asmdlk
asldk maslkd aslkd aslk daslmd lkasd das das das das das dasd ajsd
akjsnd asndlk asmdlk asldk maslkd aslkd aslk daslmd lkasd das das das
das das dasd ajsd akjsnd asndlk asmdlk asldk maslkd aslkd aslk daslmd
lkasd das das das das das dasd ajsd akjsnd asndlk asmdlk asldk maslkd
aslkd aslk daslmd lkasd
</span>
</div>
<!-- <div class="con">
<div class="box">
<h1>3 Box Shadow Hacks</h1>
<button class="custom-button">click me</button>
</div>
<div class="box">
<h1>3 Box Shadow Hacks</h1>
<button class="custom-button">click me</button>
</div>
<div class="box">
<h1>3 Box Shadow Hacks</h1>
<button class="custom-button">click me</button>
</div>
<div class="box">
<div class="input-wrap"><input type="text" /></div>
</div>
<div class="gap"></div>
<div class="modal"></div>
</div> -->
</body>
</html>