CSS Map pin
How do I make an css map pin?
Inline MapPin with some CSS. What is a css map pin? How do you make a css map pin? This script and codes were developed by Robert on 08 November 2022, Tuesday.
CSS Map pin - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>CSS Map pin</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <span class="pin"></span> Hamburg
</body>
</html>
CSS Map pin - Script Codes CSS Codes
html { padding: 100px 0 0; background: #22be21; font-size: 30px; color: #fff; text-align: center;
}
.pin { position: relative; display: inline-block; width: 1em; height: 1em; border-radius: 100%; box-shadow: inset 0 0 0 0.3em #fff;
}
.pin::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -0.45em; margin-top: -0.25em; border-style: solid; border-width: 0.6em 0.45em; border-color: #fff transparent transparent;
}
Developer | Robert |
Username | rendro |
Uploaded | November 08, 2022 |
Rating | 3 |
Size | 2,001 Kb |
Views | 20,240 |
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Name | Size |
Float Label Pattern | 2,430 Kb |
CSS device icons | 2,360 Kb |
3D canvas cube | 2,895 Kb |
CSS Slideshow | 1,847 Kb |
Circular minimal countdown | 4,639 Kb |
Mobile navigation button | 2,659 Kb |
Flexbox slider | 3,459 Kb |
CSS3 Diamond | 1,960 Kb |
A Pen by Robert | 3,362 Kb |
Responsive image grid | 2,345 Kb |
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Name | Username | Size |
Retina canvas w. resize | Erikterwan | 1,882 Kb |
Mobile first social buttons with no iframe | Alistairtweedie | 3,158 Kb |
Polygon Logo in CSS | Kai | 3,412 Kb |
Portfolio Landing Page | FDfranklin | 3,585 Kb |
Cant get enough icecream in pure css3 | Melawire | 4,322 Kb |
Awesome | Samarthpd | 2,901 Kb |
Slick Slider | Wearebold | 5,913 Kb |
CSS Dynamic Width Square Div | Elleestcrimi | 2,861 Kb |
Pure CSS read more toggle | Idered | 2,344 Kb |
IE flex collapse bug fix | Rowno | 2,678 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!