Skip to content

Instantly share code, notes, and snippets.

@justmarkup

justmarkup/style.css

Created April 16, 2019 06:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save justmarkup/993efabc8cceef238a65f5a25fcd609e to your computer and use it in GitHub Desktop.
Save justmarkup/993efabc8cceef238a65f5a25fcd609e to your computer and use it in GitHub Desktop.
Download ZIP
:focus-within example
Raw
style.css
form {
padding: 10px;
position: relative;
overflow: hidden;
}
form:before {
content:"";
background: #ddd;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: -1;
transform: translateY(-100%);
transition: transform 260ms ease-out;
}
form:focus-within:before {
transform: translateY(0);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment