在CSS中，百分比和px可以一起使用，代码如下：
left: calc(10% + 10px)
.class { width: calc(50% - 100px)
}
注意：设置完left: 10px后 使用 padding-left: 10px盒子内部向右移动10px，如果让盒子整体移动，用margin-left: 10px
扩展资料：
px的特点：
1、IE无法调整那些使用px作为单位的字体大小；
2、国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位；
3、Firefox能够调整px和em，rem，但是有大部分的国产浏览器使用IE内核；
4、px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的,可以定宽、定高；
5、em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸；
如果单单就你的例子，你把width:100%去掉不就好了。div本来就是块元素，用不着加width:100%啊。
你要的效果就是div加了border充满整个页面，宽度上可以实现的哦...
高度你是定义死的。
如果还有其他原因，比如其他属性影响到的话，你写全一点代码意思意思，从你给的demo看不出来有什么问题。
另外width:100%-10px
CSS里面可没有这么算东西的，你要是要计算就得用js来控制....
你个应该得计算一下，你就别用height:100%了。比如说，你的父级元素是100px，那就写height:90%就好了。
再说了，你为什么非得用百分比呢，不能用具体像素吗？？？
