[Kein]

Весь код приводить не буду, слишком много левых данных:
Это расчет ширины, area jquery объект

area.children().each(function(i){
            //alert(this.offsetWidth + ' ' + (this['getWidth']?this.getWidth():'')+' -');
            width += parseInt(this.offsetWidth);
        });
area.css('width', width);

<div id="scroll_wraper">
<div class="scroll_area" id="scroll">
<div class="area" id="area">
    <div class="category">
        <div class="category-image"><img src="img/1.jpg"/></div>
        <div class="category-block">Some text</div>
        <div class="category-block">Some text</div>
        <div class="category-block">Some text</div>
    </div>
    <div class="category">
        <div class="category-image"><img src="img/1.jpg"/></div>
        <div class="category-block">Some text</div>
        <div class="category-block">Some text</div>
        <div class="category-block">Some text</div>
    </div>
    <div class="clear"></div>
</div>
</div>
<div class="menu"></div>
</div>
<style>
.clear{clear: both; width: 0;}
.category {
    float: left;
}
.category .category-block, .category .category-image{
    float: left;
}
.category .category-block{
    width: 200px;
}
.category .category-image{
    width: 308px;
}
.scroll_area{
    width: 800px; height: 368px; overflow: auto;
    position: relative;
}
.scroll_area .area{
    position: absolute;
    left: 0; top: 0;
    height: 232px;
}
.scroll_area img {
    float: left;
}
</style>

Вот примерно так, как уже писал выше проверка размера вызывается только после DomLoaded.