CSS 100% 干净地填充父 div

发布于 2024-12-19 10:51:03 字数 232 浏览 1 评论 0原文

我希望能够用子 span 100% 填充父级的 div。 问题是我想要填充它的跨度以 themeroller 为主题,并且它具有不同的填充和边距。所以我无法对跨度的高度进行硬编码。

如果我尝试将跨度的高度设置为 100%,那么它实际上会超出并填充该主题的更像 100% + 6 像素(但超出的量因主题而异)。如何才能做到无论 Span 的内边距/边距大小如何,它都只能填充 100% 的父 div?

非常感谢您的帮助。

I want to be able to fill a parent's div exactly 100% with a child span.
The problem is the span that I want to fill it with is themed with themeroller and it has varying padding, and margins. So I cannot hard code any sizes for the height of the span.

If I try to set the height of the span to 100% then it actually goes over and fills more like 100% + 6 pixels for this theme (but the over amount varies by theme). How do you make it so no matter what size the padding/margins for the span it will only ever fill 100% of the parent div?

Thank you very much for the help.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

牵你手 2024-12-26 10:51:03
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;    
box-sizing: border-box;

请参阅http://jsfiddle.net/mbB8t/2/

澄清:适用于所有现代浏览器 (IE8+)。

-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;    
box-sizing: border-box;

See http://jsfiddle.net/mbB8t/2/

Clarified: Works for all modern browsers (IE8+).

一身骄傲 2024-12-26 10:51:03

要实现此功能,您必须通过将跨度的 2x 宽度加上高度来计算填充和边距值。那么你就可以知道span使用什么值来填充父div。检查此处的示例 http://www.phcityonweb.com/tutorial/css -编程课程/边距填充

To make this work, you have to calculate the paddings and margins value by adding the 2xwidth of the span plus the height. then you can know what values to use for span to make it fill the parent div. check the examples here http://www.phcityonweb.com/tutorial/css-programming-lessons/margin-padding

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文