text-align:justify列表的两端对齐布局

如何实现元素的两端对齐?

text-align: justify

*****inline元素（比如a,span等），只有margin-left/margin-right有效，margin-top/margin-bottom无效

padding值都有效，但是不占据空间

margin负值来增大父标签的宽度，具体实现如bootrstrap中的栅格布局

兼容IE6/IE7浏览器需要满足 inline标签化以及结束标签连续化，列表元素间换行或留空

现代浏览器： 列表元素间换行或留空

IE8： 列表元素间换行或留空，列表元素的环境字体大小不能为0

解决列表元素最后一行无法两端对齐？

列表（或文字）要两端对齐的前提就是内容必须超过一行，所以解决最后一行元素无法两端对齐：就是在列表的最后添加一个高度为0宽度100%的透明的inline-block的标签即可

.justify_fix{display:inline-block; width: 100%; height:0; overflow:hidden}

<span class="justify_fix"></span>