ie11浏览器 内联元素设置padding-left,点击位置偏移

ie11浏览器 内联元素设置padding-left,点击位置偏移,第1张

再td元素中设置padding-left:50%,内部包含两个按钮;在chrome浏览器中显示正常,点击按钮也没问题。

但是在ie11中,一上来显示是正常的,但是当点击按钮的时候,按钮就会往左侧偏移很多。

问题的原因: ie11内联元素设置padding,对于自然内联的元素,IE要求元素具有 display: inline-block;CSS属性,它将应用像填充这样的属性。因此,只需在内联元素中添加display: inline-block 。

注: ie11有的不加display:inline-block也是显示正常,我和几个同事的不会出现这个问题,但另个同事的就会出现。可能跟ie11小版本不同的原因有关。

chrome显示正常,ie11点击按钮,按钮偏移。

添加display:inline-block重设padding-left即可。

chrome、ie11显示正常。

1、padding属性是css用于在一个声明中设置所有padding属性的简写属性。

2、Padding属性包含了paddingleft:左补距离(设置距左内边距)。paddingtop:头顶补距离(设置距顶部内边距)。paddingright:右补距离(设置距右内边距)。paddingbottom:底补距离(设置距低内边距)。其二维构建图可见CSS属性二维图。

3、paddingleft用法:padding-left:10px。这个意思距离左边补距10像素,可跟百分比如(padding-left:10%。距离左边补10%的距离)。

4、paddingright用法:padding-right:10px。这个意思距离右边补距10像素,可跟百分比如(padding-right:10%。距离右边补10%的距离)。

5、paddingtop用法:padding-top:10px。这个意思距离顶边补距10像素,可跟百分比如(padding-top:10%。距离顶边补10%的距离)。

6、paddingbottom用法:padding-bottom:10px。这个意思距离低边补距10像素,可跟百分比如(padding-bottom:10%。距离底边补10%的距离)。


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/tougao/11215347.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-14
下一篇 2023-05-14

发表评论

登录后才能评论

评论列表(0条)

保存