Html css缩放后的空白

我有一个iframe，它显示缩放后的网站，但在缩放后，保留空白，其大小是缩放前的大小。我试图用不同的div来包装它，因为我已经找到了一些解决方案，但它对我不起作用，空间仍然存在

你可以看到

HTML

---

有什么想法吗？谢谢。

如果你想摆脱窗口滚动条，你可以将

溢出：隐藏
应用到
\preview\u div
以隐藏额外的空间。
在iFrame中，容器div（）的CSS宽度为630px。iFrame本身上还有一个带有的像素。
变换的工作方式类似于
位置：相对
-元素在文档流中保持其原始大小和位置，它们只是通过变换进行渲染。
<div id='wrap'>    
<div id='preview_div'>
     <iframe src="../404/index.php"></iframe>
</div>
</div>

#preview_div {
    position: relative;
    width: 700px;
    height:600px;
    margin:auto;
}

iframe {
    background-color:white;
    width: 1400px;
    height: 960px;
    position: relative;
    overflow:hidden;
    border: none;

    -moz-transform: scale(0.5);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.5);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.5);
    -webkit-transform-origin: 0 0;
}

#wrap {
    width:700px;
    height:600px;
    margin:auto;
    float:left;
}