JSFiddle - React, Tailwind, and code Playground

by xavi3r

HTML

<div id="overflow">
<div class="container">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
</div>

CSS

#overflow{border:1px solid #000;height:220px;width:220px;overflow-x:scroll;overflow-y:hidden;}
#overflow .container{}
#overflow .container div{border:1px solid #CCC;float:left;width:200px;height:200px;float:left;}

JavaScript

$(function(){
var width = 0;
$('#overflow .container div').each(function() {
    width += $(this).outerWidth( true );
});
$('#overflow .container').css('width', width + "px");
alert(width);
});