Skip to content

Instantly share code, notes, and snippets.

@jessamynsmith
Created July 22, 2015 04:06
Show Gist options
  • Save jessamynsmith/b9721d8606fc14acec07 to your computer and use it in GitHub Desktop.
Save jessamynsmith/b9721d8606fc14acec07 to your computer and use it in GitHub Desktop.
xGapOP
<div class="container">
<div class="big">
<div class="medium">
<div class="small">
</div>
</div>
</div>
</div>
.container {
width: 16%;
}
.big {
background-color: #68cdd9;
width: 100%;
padding-bottom: 100%;
border-radius: 50%;
}
.medium {
background-color: #a0dbcc;
float: left;
width: 74%;
margin-top: 13%;
margin-left: 13%;
padding-bottom: 14%;
border-radius: 50%;
z-index: 5;
}
.small {
background-color: #00abc9;
width: 60%;
margin-top: 20%;
margin-left: 20%;
padding-bottom: 60%;
border-radius: 50%;
z-index: 10;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment