Skip to content

Instantly share code, notes, and snippets.

@Abdelhak-Bahri

Abdelhak-Bahri/weird-sqrt.html

Created June 1, 2021 15:37
Show Gist options
  • Save Abdelhak-Bahri/881e962fbec182d34e9fa608c8cb1fe6 to your computer and use it in GitHub Desktop.
Save Abdelhak-Bahri/881e962fbec182d34e9fa608c8cb1fe6 to your computer and use it in GitHub Desktop.
Download ZIP
it's not meant to be on production. this is just a joke about how to find sqrt using html and yet there are more weird ways
Raw
weird-sqrt.html
<!DOCTYPE html>
<html>
<head>
<style>
body{
margin:0;
}
.container{
width:25vw;
height: 100vh;
border:1px solid rgb(0, 0, 0);
overflow: scroll;
}
.number{
background: #E3E3E3;
border: 1px solid #EAEAEA;
display: inline-block;
padding:10px;
width: 100%;
height: 200px;
}
.number .sqrt{
display: none;
position: absolute;
top: 40vh;
left: 50vw;
font-size: 100px;
}
.number:hover{
border: 1px solid red;
}
.number:hover .sqrt{
display: block;
}
</style>
</head>
<body>
<div class="container">
<button class="number">
1
<div class="sqrt">1,00</div>
</button>
<button class="number">
2
<div class="sqrt">1,41</div>
</button>
<button class="number">
3
<div class="sqrt">1,73</div>
</button>
<button class="number">
4
<div class="sqrt">2,00</div>
</button>
<button class="number">
5
<div class="sqrt">2,24</div>
</button>
<button class="number">
6
<div class="sqrt">2,45</div>
</button>
<button class="number">
7
<div class="sqrt">2,65</div>
</button>
<button class="number">
8
<div class="sqrt">2,83</div>
</button>
<button class="number">
9
<div class="sqrt">3,00</div>
</button>
<button class="number">
10
<div class="sqrt"> 3,16</div>
</button>
<button class="number">
11
<div class="sqrt"> 3,32</div>
</button>
<button class="number">
12
<div class="sqrt"> 3,46</div>
</button>
<button class="number">
13
<div class="sqrt"> 3,61</div>
</button>
<button class="number">
14
<div class="sqrt"> 3,74</div>
</button>
<button class="number">
15
<div class="sqrt"> 3,87</div>
</button>
<button class="number">
16
<div class="sqrt"> 4,00</div>
</button>
<button class="number">
17
<div class="sqrt"> 4,12</div>
</button>
<button class="number">
18
<div class="sqrt"> 4,24</div>
</button>
<button class="number">
19
<div class="sqrt"> 4,36</div>
</button>
<button class="number">
20
<div class="sqrt"> 4,47</div>
</button>
<button class="number">
21
<div class="sqrt"> 4,58</div>
</button>
<button class="number">
22
<div class="sqrt"> 4,69</div>
</button>
<button class="number">
23
<div class="sqrt"> 4,80</div>
</button>
<button class="number">
24
<div class="sqrt"> 4,90</div>
</button>
<button class="number">
25
<div class="sqrt"> 5,00</div>
</button>
<button class="number">
26
<div class="sqrt"> 5,10</div>
</button>
<button class="number">
27
<div class="sqrt"> 5,20</div>
</button>
<button class="number">
28
<div class="sqrt"> 5,29</div>
</button>
<button class="number">
29
<div class="sqrt"> 5,39</div>
</button>
<button class="number">
30
<div class="sqrt"> 5,48</div>
</button>
<button class="number">
31
<div class="sqrt"> 5,57</div>
</button>
<button class="number">
32
<div class="sqrt"> 5,66</div>
</button>
<button class="number">
33
<div class="sqrt"> 5,74</div>
</button>
<button class="number">
34
<div class="sqrt"> 5,83</div>
</button>
<button class="number">
35
<div class="sqrt"> 5,92</div>
</button>
<button class="number">
36
<div class="sqrt"> 6,00</div>
</button>
<button class="number">
37
<div class="sqrt"> 6,08</div>
</button>
<button class="number">
38
<div class="sqrt"> 6,16</div>
</button>
<button class="number">
39
<div class="sqrt"> 6,24</div>
</button>
<button class="number">
40
<div class="sqrt"> 6,32</div>
</button>
<button class="number">
41
<div class="sqrt"> 6,40</div>
</button>
<button class="number">
42
<div class="sqrt"> 6,48</div>
</button>
<button class="number">
43
<div class="sqrt"> 6,56</div>
</button>
<button class="number">
44
<div class="sqrt"> 6,63</div>
</button>
<button class="number">
45
<div class="sqrt"> 6,71</div>
</button>
<button class="number">
46
<div class="sqrt"> 6,78</div>
</button>
<button class="number">
47
<div class="sqrt"> 6,86</div>
</button>
<button class="number">
48
<div class="sqrt"> 6,93</div>
</button>
<button class="number">
49
<div class="sqrt"> 7,00</div>
</button>
<button class="number">
50
<div class="sqrt"> 7,07</div>
</button>
<button class="number">
51
<div class="sqrt"> 7,14</div>
</button>
<button class="number">
52
<div class="sqrt"> 7,21</div>
</button>
<button class="number">
53
<div class="sqrt"> 7,28</div>
</button>
<button class="number">
54
<div class="sqrt"> 7,35</div>
</button>
<button class="number">
55
<div class="sqrt"> 7,42</div>
</button>
<button class="number">
56
<div class="sqrt"> 7,48</div>
</button>
<button class="number">
57
<div class="sqrt"> 7,55</div>
</button>
<button class="number">
58
<div class="sqrt"> 7,62</div>
</button>
<button class="number">
59
<div class="sqrt"> 7,68</div>
</button>
<button class="number">
60
<div class="sqrt"> 7,75</div>
</button>
<button class="number">
61
<div class="sqrt"> 7,81</div>
</button>
<button class="number">
62
<div class="sqrt"> 7,87</div>
</button>
<button class="number">
63
<div class="sqrt"> 7,94</div>
</button>
<button class="number">
64
<div class="sqrt"> 8,00</div>
</button>
<button class="number">
65
<div class="sqrt"> 8,06</div>
</button>
<button class="number">
66
<div class="sqrt"> 8,12</div>
</button>
<button class="number">
67
<div class="sqrt"> 8,19</div>
</button>
<button class="number">
68
<div class="sqrt"> 8,25</div>
</button>
<button class="number">
69
<div class="sqrt"> 8,31</div>
</button>
<button class="number">
70
<div class="sqrt"> 8,37</div>
</button>
<button class="number">
71
<div class="sqrt"> 8,43</div>
</button>
<button class="number">
72
<div class="sqrt"> 8,49</div>
</button>
<button class="number">
73
<div class="sqrt"> 8,54</div>
</button>
<button class="number">
74
<div class="sqrt"> 8,60</div>
</button>
<button class="number">
75
<div class="sqrt"> 8,66</div>
</button>
<button class="number">
76
<div class="sqrt"> 8,72</div>
</button>
<button class="number">
77
<div class="sqrt"> 8,77</div>
</button>
<button class="number">
78
<div class="sqrt"> 8,83</div>
</button>
<button class="number">
79
<div class="sqrt"> 8,89</div>
</button>
<button class="number">
80
<div class="sqrt"> 8,94</div>
</button>
<button class="number">
81
<div class="sqrt"> 9,00</div>
</button>
<button class="number">
82
<div class="sqrt"> 9,06</div>
</button>
<button class="number">
83
<div class="sqrt"> 9,11</div>
</button>
<button class="number">
84
<div class="sqrt"> 9,17</div>
</button>
<button class="number">
85
<div class="sqrt"> 9,22</div>
</button>
<button class="number">
86
<div class="sqrt"> 9,27</div>
</button>
<button class="number">
87
<div class="sqrt"> 9,33</div>
</button>
<button class="number">
88
<div class="sqrt"> 9,38</div>
</button>
<button class="number">
89
<div class="sqrt"> 9,43</div>
</button>
<button class="number">
90
<div class="sqrt"> 9,49</div>
</button>
<button class="number">
91
<div class="sqrt"> 9,54</div>
</button>
<button class="number">
92
<div class="sqrt"> 9,59</div>
</button>
<button class="number">
93
<div class="sqrt"> 9,64</div>
</button>
<button class="number">
94
<div class="sqrt"> 9,70</div>
</button>
<button class="number">
95
<div class="sqrt"> 9,75</div>
</button>
<button class="number">
96
<div class="sqrt"> 9,80</div>
</button>
<button class="number">
97
<div class="sqrt"> 9,85</div>
</button>
<button class="number">
98
<div class="sqrt"> 9,90</div>
</button>
<button class="number">
99
<div class="sqrt"> 9,95</div>
</button>
<button class="number">
100
<div class="sqrt"> 10,00</div>
</button>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment