css3 比例周围的空白

我有一个小问题想要解决，但找不到任何好的答案：

当我在 div （包含其他 div）上使用比例时，它会在 div 的“原始”宽度和高度周围留下空白：

如何在缩放时删除 div 周围的空白？

如果需要的话我可以使用js！

编辑：这是一些代码：

HTML

<div class="pull-right nextpack">

                    <div class="quarter scale-thumb">

                        <div class="up">
                            <div class="inner" style="background-image: url({{URL::base().'/galery/th293x711/'.$nextpack->src}})"></div>
                        </div>

                        <div class="face">
                            <div class="top" style="background-image: url({{URL::base().'/galery/th293x711/'.$nextpack->src}})"></div>
                            <div class="bot" style="background-image: url({{URL::base().'/galery/th293x711/'.$nextpack->src}})"></div>
                        </div>

                        <div class="cote-droit">
                            <div class="inner">
                                <div class="cote-droit-top" style="background-image: url({{URL::base().'/galery/th293x711/'.$nextpack->src}})"></div>
                                <div class="cote-droit-bot" style="background-image: url({{URL::base().'/galery/th293x711/'.$nextpack->src}})"></div>
                            </div>
                        </div>

                    </div>


                </div>

CSS（你真的不需要知道这个包是如何完成的，它有很多 css3 没有什么用，基本上只是倾斜、旋转、缩放以从平面模板制作 3D 渲染）

.quarter.scale-thumb
{
-webkit-transform: scale(0.2);
-moz-transform: scale(0.2);
-o-transform: scale(0.2);
transform: scale(0.2);
}

PS：第一张图片是当我不添加scale-thumb类时

how transform作品是：

1. 你的元素被渲染
2. 你的元素被变换（移动、旋转、缩放）
3. 其他元素保留在渲染的位置 - 围绕“原始元素”

所以空白实际上就是元素最初渲染的方式。

你应该使用width and height在 CSS 中，如果你想以不同的方式渲染元素的大小并让周围的元素对其做出响应。

或者你可以使用 JavaScript 之类的东西来调整大小。