Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
// Load Flexbox Grid
add_action( 'wp_enqueue_scripts', 'sk_enqueue_flexbox_grid' );
function sk_enqueue_flexbox_grid() {
wp_enqueue_style( 'flexboxgrid', CHILD_URL . '/css/flexboxgrid.min.css' );
}
<div class="flexbox-grid">
<div class="row">
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-1">
<div class="box-row"></div>
</div>
<div class="col-xs-6 col-sm-6 col-md-8 col-lg-10">
<div class="box-row"></div>
</div>
<div class="col-xs-6 col-sm-3 col-md-2 col-lg-1">
<div class="box-row"></div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-1">
<div class="box-row"></div>
</div>
<div class="col-xs-12 col-sm-9 col-md-10 col-lg-11">
<div class="box-row"></div>
</div>
</div>
<div class="row">
<div class="col-xs-10 col-sm-6 col-md-8 col-lg-10">
<div class="box-row"></div>
</div>
<div class="col-xs-2 col-sm-6 col-md-4 col-lg-2">
<div class="box-row"></div>
</div>
</div>
</div>
.flexbox-grid {
margin-top: 40px;
}
.box-row {
padding: 20px;
margin-bottom: 20px;
background-color: #007fff;
border-radius: 2px;
}
.flexbox-grid p {
margin-bottom: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.