Last active
December 29, 2015 02:49
-
-
Save irae/7603193 to your computer and use it in GitHub Desktop.
It's not possible to make a proper flex box / flex wrap polyfill, but this one solves one particular problem.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function(global){ | |
'use strict'; | |
function flexFix() { | |
var list = document.querySelector('.flexFix'); | |
if (!list) { return ;} | |
var items = list.children; | |
if (!items.length) { return ;} | |
var newContainer; | |
var perLine = 4; | |
var stopper = items.length % perLine + 1; | |
while (items.length > stopper) { | |
if(!newContainer || newContainer.children.length === perLine) { | |
newContainer = document.createElement(list.tagName); | |
newContainer.className = list.className; | |
list.parentNode.insertBefore(newContainer, list); | |
} | |
newContainer.appendChild(items[0]); | |
} | |
} | |
/* global Modernizr */ | |
if (Modernizr && Modernizr.flexbox === false) { | |
global.addEventListener('DOMContentLoaded', flexFix, false); | |
} | |
})(this); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment