大佬教程收集整理的这篇文章主要介绍了css – 显示时边距,位置和填充不起作用:设置了内联.相对位置也有奇怪的行为,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
.class1 { height: 100%; width: 300px; border: 1px none #B0B0B0; position: relative; display: inline; left: 10px; } .class2 { height: 100%; width: 200px; position: relative; display: inline; margin-left: 15px; BACkground-color: #00CCCc; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; }
现在,正如您所看到的,它们都设置为显示在一行中(元素之间没有换行符).哪个工作正常.但出于某种原因,自从我将显示设置为内联后,Padding,Positioning和Margin CSS都停止了工作.我可以添加一个保证金左10英寸,什么都不会发生.与填充和定位相同.
谁能解释如何解决这个问题?
此外,我在两个类上都设置了相对位置,但是当在浏览器中查看页面时,.class2超过圈数.class1,当它应该在.class1之后.
有任何想法吗?
编辑:
好吧,所以我做了一个JSFiddle,但它似乎在那里播放更多….
看起来宽度不起作用….
这里是:
display: inline-block;
代替. margin不适用于display:内联元素,但是使用inline-block.然后,您可以使用具有边距和显式宽度/高度的内联元素.
要在IE7中使其工作,请添加以下两行:
*display: inline; zoom: 1;
这太可怕了,但确实有效.
以上是大佬教程为你收集整理的css – 显示时边距,位置和填充不起作用:设置了内联.相对位置也有奇怪的行为全部内容,希望文章能够帮你解决css – 显示时边距,位置和填充不起作用:设置了内联.相对位置也有奇怪的行为所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。