xxxxxxxxxx1
2
<div class="scrollbar scrollbar-primary">3
<div class="force-overflow"></div>4
</div>5
6
<!--Material textarea-->7
<div class="md-form ">8
<textarea type="text" id="form7" class="md-textarea form-control" rows="3"></textarea>9
<label for="form7">Material textarea</label>10
</div>xxxxxxxxxx1
.scrollbar {2
margin-left: 0px;3
float: left;4
height: 300px;5
width: 650px;6
background: #fff;7
overflow-y: scroll;8
margin-bottom: 25px;9
}10
.force-overflow {11
min-height: 450px;12
}13
14
.scrollbar-primary::-webkit-scrollbar {15
width: 12px;16
background-color: #F5F5F5; }17
18
.scrollbar-primary::-webkit-scrollbar-thumb {19
border-radius: 10px;20
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);21
background-color: #4285F4; }22
23
.scrollbar-danger::-webkit-scrollbar-track {24
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);25
background-color: #F5F5F5;26
border-radius: 10px; }27
28
.scrollbar-danger::-webkit-scrollbar {29
width: 12px;30
background-color: #F5F5F5; }31
32
.scrollbar-danger::-webkit-scrollbar-thumb {33
border-radius: 10px;34
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);35
background-color: #ff3547; }36
37
.scrollbar-warning::-webkit-scrollbar-track {38
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);39
background-color: #F5F5F5;40
border-radius: 10px; }41
42
.scrollbar-warning::-webkit-scrollbar {43
width: 12px;44
background-color: #F5F5F5; }45
46
.scrollbar-warning::-webkit-scrollbar-thumb {47
border-radius: 10px;48
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);49
background-color: #FF8800; }50
51
.scrollbar-success::-webkit-scrollbar-track {52
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);53
background-color: #F5F5F5;54
border-radius: 10px; }55
56
.scrollbar-success::-webkit-scrollbar {57
width: 12px;58
background-color: #F5F5F5; }59
60
.scrollbar-success::-webkit-scrollbar-thumb {61
border-radius: 10px;62
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);63
background-color: #00C851; }64
65
.scrollbar-info::-webkit-scrollbar-track {66
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);67
background-color: #F5F5F5;68
border-radius: 10px; }69
70
.scrollbar-info::-webkit-scrollbar {71
width: 12px;72
background-color: #F5F5F5; }73
74
.scrollbar-info::-webkit-scrollbar-thumb {75
border-radius: 10px;76
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);77
background-color: #33b5e5; }78
79
.scrollbar-default::-webkit-scrollbar-track {80
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);81
background-color: #F5F5F5;82
border-radius: 10px; }83
84
.scrollbar-default::-webkit-scrollbar {85
width: 12px;86
background-color: #F5F5F5; }87
88
.scrollbar-default::-webkit-scrollbar-thumb {89
border-radius: 10px;90
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);91
background-color: #2BBBAD; }92
93
.scrollbar-secondary::-webkit-scrollbar-track {94
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);95
background-color: #F5F5F5;96
border-radius: 10px; }97
98
.scrollbar-secondary::-webkit-scrollbar {99
width: 12px;100
background-color: #F5F5F5; }101
102
.scrollbar-secondary::-webkit-scrollbar-thumb {103
border-radius: 10px;104
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);105
background-color: #aa66cc; }1
1
Console errors: 0