Skip to content

Instantly share code, notes, and snippets.

@brendanfalkowski

brendanfalkowski/flex-wrap.html

Created March 26, 2014 21:01
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 brendanfalkowski/9793413 to your computer and use it in GitHub Desktop.
Save brendanfalkowski/9793413 to your computer and use it in GitHub Desktop.
Download ZIP
Example of multi-column RWD with flex-wrap.
Raw
flex-wrap.html
<div class="flex-test">
<p class="flex-test-item">Nulla facilisi. Duis aliquet egestas purus in blandit. Curabitur vulputate, ligula lacinia scelerisque tempor.</p>
<p class="flex-test-item">Nulla facilisi. Duis aliquet egestas purus in blandit. Curabitur vulputate, ligula lacinia scelerisque tempor. ligula lacinia scelerisque tempor. ligula lacinia scelerisque tempor.</p>
<p class="flex-test-item">Nulla facilisi. Duis aliquet egestas purus in blandit. Curabitur vulputate, ligula lacinia scelerisque tempor.</p>
<p class="flex-test-item">Nulla facilisi. Duis aliquet egestas purus in blandit. Curabitur vulputate, ligula lacinia scelerisque tempor.</p>
</div>
<style>
.flex-test {
display:flex;
flex-flow:row wrap;
background:#0F0;
}
.flex-test-item {
flex:1 0 250px;
background:#F00;
}
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment