元素的padding 和 margin百分比都是想对应父元素的width（父元素必须有width这个值 否则往上查找知道body）来说的， 如下通用的css正方形方案
设置一个伪元素，伪元素用的是利用 padding-bottom撑起父元素的高度，padding相对高度为 父元素的 width
针对此情况，
请检查是否是因为你 Photoshop中已然对图片进行了相应的缩放.
还有一种情况就是。你屏幕分辨率影响到截图的准确性。
解决办法：
你可以采用某浏览器，将网页保存为图片
然后在 Photoshop中，将此png格式的图片载入，100%显示
然后在 Photoshop中进行裁剪，再比较大小。
一般来说，是多大就是多大，是不会出现相应的误差的。
你这个div的代码，我检测过了，是没有问题的。
可以的.box {
width: 300px
background-color: #ccc
-moz-border-radius: 10px
border-radius: 10px
} 试试这个
