Skip to content

Instantly share code, notes, and snippets.

@xem
Created February 22, 2012 08:00
Show Gist options
  • Save xem/1883343 to your computer and use it in GitHub Desktop.
Save xem/1883343 to your computer and use it in GitHub Desktop.
Y U NO ?
/* Y U NO ? */
body { background: #13579B; }
.outer1 { width: 100px; height: 100px; margin: 100px auto; }
.inner1 { width: 100%; height: 100%; text-align: center; background: #FEDCBA; transition: all 1s ease; }
.outer1:hover { position: absolute; top: 0; left: 0; }
.outer2 { width: 100px; height: 100px; position: relative; margin: 100px auto; }
.outer2:hover { position: static; }
.inner2 { text-align: center; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #FEDCBA; transition: all 1s ease; }
<div class="outer1">
<div class="inner1">
Hover me
</div>
</div>
<div class="outer2">
<div class="inner2">
Hover me
</div>
</div>
{"view":"split","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment