超大块元素的保证金问题

Question

保证金问题
我正在使用超大块元素(宽度和高度分别为2000-4000px),并且大多数元素溢出窗口/视口.这很好,是我的应用程序的预期效果.但是,当我对所有边上的元素应用边距时,例如40px,它仅应用于顶部,左侧和底部.滚动后,最右边缘与窗口边缘齐平.我希望块元素的所有边都有一个均匀的边距.

代码
见下文或查看简化测试用例的jsFiddle.

<!-- HTML -->

<div></div>

/* CSS */

* {
    margin: 0;
    padding: 0;    
}

div {
    background: #000;
    height: 3000px;
    margin: 40px;
    width: 3000px;    
}?

我曾经尝试过
我尝试过上述方法,我最初认为这种方法可行,但事实并非如此.我也试过在body元素上应用40px的填充,并从div中删除边距,但得到了相同的结果.对于应用了填充的包含元素也是如此.

任何帮助将不胜感激.谢谢!

Answer 1

让您的 div 成为内联块元素怎么样？

添加display:inline-block到您的 div 中应该可以解决问题。

查看更新的小提琴-DEMO