A-A+

margin-top百分比问题

2016年03月24日 htmlcss 暂无评论 阅读 78 次

一个很简单的小细节,不过平时没怎么注意到,还被小坑了一下。在设置margin的时候:margin: 10% 10%

没有出现预想的效果。
其实margin-top和margin-bottom的百分比,一般是按容器元素的宽度而不是高度来计算的,padding同理。
比如下面这个例子:
margin-top百分比问题 - cxxsn - cxxsn的博客
margin-top百分比问题 - cxxsn - cxxsn的博客
margin-top百分比问题 - cxxsn - cxxsn的博客
不过也并不是绝对的,当设置了writing-mode为纵向书写时,比如-webkit-writing-mode: vertical-lr;此时按百分比书写的margin就会参照容器的高度来计算了。
标签:

给我留言

Copyright © web前端技术开发个人博客 保留所有权利  京ICP备14060653号 Theme  Ality

用户登录