diff --git a/solutions/position/3/Position 3 Solution.gif b/solutions/position/3/Position 3 Solution.gif new file mode 100644 index 0000000..1db2a75 Binary files /dev/null and b/solutions/position/3/Position 3 Solution.gif differ diff --git a/solutions/position/3/index.html b/solutions/position/3/index.html new file mode 100644 index 0000000..31d1da0 --- /dev/null +++ b/solutions/position/3/index.html @@ -0,0 +1,21 @@ + + + + + + + + + Position 3 Solution + + + + + + + \ No newline at end of file diff --git a/solutions/position/3/style.css b/solutions/position/3/style.css new file mode 100644 index 0000000..a9fa38e --- /dev/null +++ b/solutions/position/3/style.css @@ -0,0 +1,39 @@ +*{ + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body{ + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); +} + +.search-icon{ + position: absolute; + font-size: 20px; + top: 14px; + left: 14px; +} + +.search-input{ + font-size: 18px; + border: 3px solid #aaaaaa; + width: 300px; + padding: 12px; + border-radius: 48px; +} + +.search-input::placeholder{ + padding-left: 28px; +} + +.search-input:focus{ + padding-left: 44px; +} + +.search-input:focus::placeholder{ + color: transparent; +}