为啥没有inner div margin-right 和outer div padding-right?
Posted
技术标签:
【中文标题】为啥没有inner div margin-right 和outer div padding-right?【英文标题】:Why there is no inner div margin-right and outer div padding-right?为什么没有inner div margin-right 和outer div padding-right? 【发布时间】:2014-09-06 19:51:40 【问题描述】:一个大的内部 div 在一个小的外部 div 中,外部 div 溢出-自动。 但是为什么没有inner div margin-right 和outer div padding-right?
html
<div class="outer">
<div class="inner"></div>
</div>
css
.outer
width: 100px;
height: 100px;
padding: 50px;
overflow: auto;
background: #ccc;
.inner
width: 150px;
height: 150px;
margin: 50px;
background: red;
fiddle
好吧,问一个好问题并不容易。 (1)外层div的宽高可变,最大为屏幕。 (2)内部div的宽高是固定的,但总是大于外部div (3)我只希望内部div看起来像中心和一些像素来显示内部div box-shadow,但是没有inner div margin-right和outer div padding-right,所以我们看不到inner div right box-shadow
我只是明白了。
.inner
display: inline-block; /*this does work*/
width: 150px;
height: 150px;
margin: 50px;
background: red;
只需设置inner div display = inline-block。谁能告诉我为什么?
【问题讨论】:
你在哪里设置边距和内边距? 因为内部 div 中可能不需要填充/边距...取决于您的额外代码是什么样的 @florin.prisecariu 正如我所提到的,我只需要一些像素来显示内部 div 框阴影,然后内部 div 可以看起来像中心 【参考方案1】:您看不到右边距,因为外部 div 比内部 div 小
检查http://jsfiddle.net/tNKhk/1/
我扩大了外部的div
.outer
width: 250px;
height: 250px;
【讨论】:
zh,我不能那样做,可能内部 div 宽度 = 2000px,高度 = 2000px。它超出了屏幕。【参考方案2】:把你的css改成
.outer
width: 100px;
height: 100px;
padding: 50px;
overflow: auto;
background: #ccc;
.inner
width: 150px;
height: 150px;
margin: -25px;
background: red;
【讨论】:
抱歉,还是不行。而且看起来很奇怪。你可以在 jsfiddle 上试试。但我得到了答案,只需设置 inner div display = inline-block.但我不知道为什么以上是关于为啥没有inner div margin-right 和outer div padding-right?的主要内容,如果未能解决你的问题,请参考以下文章
如何在 ionic v4 中的 item-native div 中编辑“item-inner”类?
为啥这个使用 INNER JOIN 的 SQL DELETE 查询不起作用? [复制]