MENU

Hidden Confirmation Transitions

How to Create a CSS3 Pop-Out Menu

March 28, 2014 Comments (0) Views: 1878 Coding

Label Pattern with Just CSS


Warning: sizeof(): Parameter must be an array or an object that implements Countable in /home/customer/www/fribly.com/public_html/wp-content/plugins/ad-injection/ad-injection.php on line 824

Warning: count(): Parameter must be an array or an object that implements Countable in /home/customer/www/fribly.com/public_html/wp-content/plugins/ad-injection/ad-injection.php on line 831

The <label> is the placeholder. It shows because the input is on top of it with a transparent background. On focus we can move it, with just CSS, through an adacent sibling combinator and :focus. If the input is :valid, it can have a solid background, thus hiding the “placeholder”. Coded by

Check out this Pen!

Tags: #, #, #, #, #, #, #, #, #, #, #, #, #

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.