css – 无序列表中多行列表项的水平居中

前端之家收集整理的这篇文章主要介绍了css – 无序列表中多行列表项的水平居中前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个无序的列表包装在第二行,需要在包含UL内的水平居中。每个LI是一个设置的宽度和高度。我已经看到许多方法适用于单行,但是当列表包装到第二行时,我没有尝试过的方法正在工作。这将是理想的,如果这在IE7工作 – 谢谢你的帮助。

见这里说明:

http://grab.by/8UIl

解决方法

这是我可以找到的最好的方法
ul li { 
    /* make list elements fall inline as block elements */
    position: relative;
    display: inline-block;
    /* next two lines only for display purposes */
    text-align: center;
    border:1px solid red;
}
/* horizontally center ul element */
ul { text-align:center; }

请参阅链接的示例:http://jsfiddle.net/gfkPG/

猜你在找的CSS相关文章