pacery-JavaScript:Safari呈现问题

我有一个博客大小，可以将博客标题和特色图片拉入块中

然后，块由packy.js组织，以便它们在视口的整个宽度上平铺，并且每个块之间没有空间

这在除Safari之外的所有测试浏览器中都能很好地呈现，Safari会将所有div相互混淆

你以前见过这个吗？你能为可能的解决方案提出什么建议

设置为：

//依赖项：同位素.js、packer.js、ImagesLoaded.js
var$content=$（'.site main'），
$block3x3=$content.find（'.block3x3'），
$block3x2=$content.find（'.block3x2'），
$block3x1=$content.find（'.block3x1'），
$block2x2=$content.find（'.block2x2'），
$block2x1=$content.find（'.block2x1'），
$block1x1=$content.find（'.block1x1'），
itemSelector='.block'，
邮票='。邮票'，
$h1widget=$（'.h1widget'），
$instagramwidget=$（“#text-2”），
$twitterwidget=$（'.widget_fetch_tweets_widget_by_id'），
twitteractualheight=$twitterwidget.height（），
columnWidth='.grid sizer'，
排水沟='。排水沟尺寸器'，
rowHeight2=$（'.grid sizer'）.width（），
columnWidth2=$（'.grid sizer'）.width（），
排水沟2=$（'.ground sizer'）.width（）；
$h1widget.css({
“宽度”：列宽度2，
“高度”：列宽2，
“左”：“，
“顶部”：0
});
$instagramwidget.css({
“宽度”：列宽度2，
“高度”：列宽2，
“对”：“，
“顶部”：柱宽2+檐槽2
});
如果（推特）的实际高度啊哈，我明白了

实际上，我认为是JavaScript问题，结果却是一个奇怪的Safari渲染问题

为了克服这个问题，我使用了一些特定于Safari的CSS技巧来指定容器的大小，如下所示：

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) { @media {
.block {
    display: inline;
}
.block-title {
    width:370px;
}
.block3x3 {
    width: 588px;
    height: 588px;
}
.block3x2 {
    width: 588px;
    height: 384px;
}
.block3x1 {
    width: 588px;
    height: 180px;
}
.block2x2 {
    width: 384px;
    height: 384px;
}
.block2x1 {
    width: 384px;
    height: 180px;
}
.block1x1 {
    width: 180px;
    height: 180px;
}

这使Safari能够独立于容器中包含的图像而知道容器的大小

我想

如果有人能解释为什么会发生这种事，我很想知道更多