[英]CSS border inside padding
我有一个简单的 css 框,用:
border: 1px solid #CCC;
我正在尝试从文本左侧到边框添加一些空间。 我尝试使用margins
和padding
但它总是在框外,而我想要一些边距。
我在框中的文本总是附加在左侧,如何在文本和框之间添加一些边距/空格?
如果有帮助,我有代码: https : //jsfiddle.net/z2v27rcq/ 。
使用padding
,它在边界内:
div { box-sizing: border-box; display: inline-block; width: 150px; border: 1px solid #CCC; padding: 30px 20px; }
<div style="border: 1px solid #AAA"> <p> Hey! </p> </div>
您没有正确使用填充,您只需要在左侧添加一些填充:
div { display: inline-block; width: 150px; height: 50px; border: 1px solid #CCC; padding-left: 10px; }
<div style="border: 1px solid #AAA"> <p> Hey! </p> </div>
您需要在 div 本身上添加填充:
div {
padding-left: 5px;
}
或者像这样在盒子的所有侧面添加填充:
div {
padding: 5px;
}
添加一个 div 和边框到外部 div 和填充到内部 div。
<div style="border: 1px solid grey">
<div style="padding: 10px;">
<!-- Your Stuff -->
</div>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.