A Pen by Corinne Winthrop
How do I make an a pen by corinne winthrop?
What is a a pen by corinne winthrop? How do you make a a pen by corinne winthrop? This script and codes were developed by Corinne Winthrop on 08 October 2022, Saturday.
A Pen by Corinne Winthrop - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Corinne Winthrop</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <body> <form id="form" data-parsely-validate action="#"> <h2>Parsely.js validation form</h2> <div class="one-column"> <label class="columns-label" for="first-name">First Name</label> <input type="text" name="first-name" id="first-name" placeholder="Jane" required="true" /> </div> <div class="one-column"> <label class="columns-label" for="last-name">Last Name</label> <input type="text" name="last-name" placeholder="Doe" id="last-name" required="true" /> </div> <br> <div class="one-column"> <label class="columns-label" for="favorite-color">Choose two of your favorite colors below:</label> </div> <div class="two-columns"> <label for="colors"></label> <p> Blue <input type="checkbox" name="color" value="blue" data-parsley-mincheck="2"/> Red <input type="checkbox" name="color" value="red"/> Yellow <input type="checkbox" name="color" value="yellow"/> </p> </div> <br> <div class="submit"> <input type="submit" value="Submit" /> </div> </form>
</body> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://parsleyjs.org/dist/parsley.min.js'></script> <script src="js/index.js"></script>
</body>
</html>
A Pen by Corinne Winthrop - Script Codes CSS Codes
* { box-sizing: border-box;
}
body { font-family: myriad pro, sans-serif; background-color: #eee;
}
form { display: block; margin: auto; padding: 2em; width: 25em; border-radius: 6px; background-color: #6EBCDE;
}
form h2 { margin-top: 0; text-align: center; color: #eee;
}
form .one-column { margin: 1em 0;
}
form .one-column .columns-label { display: block; font-size: 0.8em;
}
form .one-column input[type="text"] { display: block; margin-top: 0.2em; width: 100%; padding-left: 0.3em; height: 2em; font-size: 1.2em; border: 0; color: #397791;
}
form .one-column input[type="text"]:focus { outline-color: #397791;
}
.parsley-mincheck { text-align: center; width: 17em; position: relative; background-color: #397791; list-style: none; left: -1em; padding: 0.6em;
}
.parsley-mincheck:after { position: absolute; content: ""; display: block; width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid #397791; top: -11px; left: 0%; transform: translateX(50%);
}
.parsley-required { position: relative; list-style: none; margin-top: 1em; left: -1em; padding: 0.6em; background-color: #397791; width: 12em; text-align: center;
}
.parsley-required:after { content: ""; display: block; width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid #397791; position: absolute; top: -11px; left: 0%; transform: translateX(50%);
}
.submit input[type="submit"] { background-color: #397791; color: white; height: 3em; width: 7em; border: none; margin: auto; display: block;
}
@media (max-width: 420px) { form { width: 100%; }
}
A Pen by Corinne Winthrop - Script Codes JS Codes
jQuery(function($){ $('#form').parsley();
});
![A Pen by Corinne Winthrop - Script Codes](http://shots.codepen.io/cwint/pen/gpzbGg-512.jpg)
Developer | Corinne Winthrop |
Username | cwint |
Uploaded | October 08, 2022 |
Rating | 3 |
Size | 3,226 Kb |
Views | 18,216 |
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 |
Pinned scrolling sections | 4,467 Kb |
Responsive Image Tiling | 2,264 Kb |
Image tiling | 2,261 Kb |
Google map with toggle categories | 32,056 Kb |
Crazy Cat Lady Application | 4,404 Kb |
Animated SVG sequence | 12,723 Kb |
Tic Tac Code | 4,142 Kb |
Cat vs Mouse | 2,435 Kb |
VUE | 1,578 Kb |
Another animated SVG sequence | 6,864 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 |
Delete Hover | Chungman93 | 2,557 Kb |
Subtle site navigation with description | Necks | 3,206 Kb |
RSW | JordanC | 3,726 Kb |
NgEasyModal | Lorenzodianni | 4,159 Kb |
Bubble animation | Ftabor | 6,565 Kb |
Disable JavaScript execution from console | Ludviglindblom | 2,534 Kb |
Portfolio Landing Page | FDfranklin | 3,585 Kb |
Project -Show the Local Weather | Luciano_Britis | 2,583 Kb |
Atom | Bhlaird | 1,932 Kb |
Pure CSS Tooltip | APinix | 2,815 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!