JSFiddle - React, Tailwind, and code Playground

by igalst

HTML

<div class="content">
<div id="body" ng-app="galleryAppWrapper" class="device-desktop" data-experiment-checkcurrencysupport="" data-experiment-productlistbulkactions="" data-experiment-addnewlanguages="" data-experiment-galleryproductandlayout="" data-experiment-cartsettings="" data-experiment-productvariants2="" data-experiment-enablearchiveorder="" data-experiment-wixstoreslaunch="" data-experiment-enablearabic="" data-experiment-enablehebrew="" data-experiment-addnewlanguagesphasetwo="" data-experiment-fixruskdaregion="" data-experiment-carticontranslation="" data-experiment-disablenewrelicclient="" data-experiment-emailtomerchantcheckbox="" data-experiment-usecommandsincoupons="" data-experiment-useshippingandtaxv2="" data-experiment-galleryfilters="" data-experiment-newstoremanagerwixtouchnewlink="" data-experiment-cartwidgeticonpickerenglishicons="" data-experiment-cartwidgetv2="" data-experiment-orderslistbulkactions="" data-experiment-enableremovedestinationbutton="" data-experiment-cartwidgeticonpicker="" data-experiment-orderdaterangefilter="" data-experiment-productpagecustomtextfield="" data-experiment-resetsettings="" data-experiment-openmediagalleryviasdk="" data-experiment-emailtobuyercheckbox="" dir="ltr">
	<!-- ngInclude: 'modules/'+galleryType+'/'+galleryType+'.html' --><div ng-controller="mainController as mainVM" post-load="true" ng-include="'modules/'+galleryType+'/'+galleryType+'.html'" ng-init="galleryType = mainVM.galleryType || 'gallery'"><gallery><div class="gallery" data-hook="gallery">
	<!-- ngIf: !galleryVM.isLoaded -->
	<!-- ngIf: galleryVM.isLoaded && !galleryVM.isFilteredProductsLoaded -->
	<!-- ngIf: galleryVM.isLoaded --><div ng-if="galleryVM.isLoaded" class="gallery-container" data-hook="gallery-container">
				<!-- ngIf: galleryVM.isShowFilters() && !galleryVM.isShowFiltersPreload() -->
				<!-- ngIf: galleryVM.isShowFiltersPreload() -->

			<div class="second-column with-sort" ng-class="{'column-down':...

CSS

.cont {
  width: 240px;
  border: solid 1px red;
  float: left;
}

.inner {
  transform-origin: top left;
}




.content {
  width: 480px;
  display: none;
}

.cont .content {
  display:block;
}

.col {
  width: 160px;
  box-sizing: border-box;
  border: solid 1px blue;
  float: left;
}



@charset "UTF-8";.select2-container .select2-choice,.select2-results .select2-result-label,.slick-slider{-ms-user-select:none;-webkit-touch-callout:none}.slick-list,.slick-slider{display:block;position:relative}.slick-loading .slick-slide,.slick-loading .slick-track{visibility:hidden}.slick-dots li button,.slick-next:focus,.slick-next:hover,.slick-prev:focus,.slick-prev:hover{background:0 0;color:transparent;outline:0}.select2-results li.select2-result-with-children>.select2-result-label,.ui-select-highlight{font-weight:700}.ngrs-range-slider,.select2-results,.slick-slider{-webkit-tap-highlight-color:transparent}.category-filter-container,.color-filter-container,.faq,.item,.list-filter-container,.select2-results li,.slick-dots,filters .filters-container .filters-container-list{list-style:none}.slick-slider{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;user-select:none;-ms-touch-action:pan-y;touch-action:pan-y}.slick-list{overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;left:0;top:0}.slick-track:after,.slick-track:before{content:"";display:table}.slick-track:after{clear:both}.slick-slide{float:left;height:100%;min-height:1px;display:none}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized...

JavaScript

var content = $('#body').parent();


var items = [
	{
  	width: 480,
    content: content.clone()
  }
]

content.remove();

//setTimeout(function() {

for (var i = 0; i < 10; i++) {
	$('<div class="cont"></div>')
  	.appendTo("body")
    .append('<div class="inner"></div>')
    .find('.inner')
  	.append(items[0].content.clone())
    .css('transform', 'scale(0.5)');

}

  
//}, 0);