为什么内部DIV从外部DIV溢出? [英] Why does inner DIV spill out of outer DIV?
本文介绍了为什么内部DIV从外部DIV溢出?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我已经远离HTML和CSS,找不到这个简单问题的解决方案.
I have been long away from HTML and CSS, can't find the solution to this simple problem.
我的另一个内有一个div.外黑色和内橙色.
I have one div inside the other. Outer Black and inner orange.
我的HTML和CSS是:
My HTML and CSS is :
#outer {
position: fixed;
width: 30%;
height: 30%;
background-color: black;
}
#inner {
width: 100%;
height: 100%;
margin: 5px;
background-color: orange;
}
<div id="outer">
<div id="inner">
</div>
</div>
为什么我的内部DIV从外部溢出?如何在不提供固定尺寸的情况下进行修复?
Why is my inner DIV spilling out of the outer ? How do I fix it without giving fixed dimensions?
推荐答案
由于边距-宽度为100%加上边距.为了避免这种情况,请编写 width:calc(100%-10px);
(=边距的两倍.)高度相同.
Because of the margin - the width is 100% PLUS the margin. To avoid that, write width: calc(100% - 10px);
(= twice the margin.) Same for height.
#outer {
position: fixed;
width: 30%;
height: 30%;
background-color: black;
}
#inner {
width: calc(100% - 10px);
height: calc(100% - 10px);
margin: 5px;
background-color: orange;
}
<div id="outer">
<div id="inner">
</div>
</div>
这篇关于为什么内部DIV从外部DIV溢出?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文