html - 如何应用ie10 hack ul li元素的css代码错误显示

Question

我在 css ie10 hack 中遇到问题。

好的观点是这个。 (在 IE11 上)

Good view on IE11

不好的观点是这样的。 (IE10 及以下)

Good view on IE10

CSS代码是

.util {float:right; margin:0 auto; border:0px solid red; margin-top:60px;}

.util ul li {float:left;}

HTML代码是

<div class="util">
                    <ul>
                            <li><a href="/login.php"><img src="/img/new/snb_01.png"></a></li>
                            <li><a href="/register.php"><img src="/img/new/snb_02.png"></a></li>
                            <li><a href="/subpage.php?p=m36"><img src="/img/new/snb_03.png"></a></li>
                            <li><a href="/board.php?bo_table=m31"><img src="/img/new/snb_04.png"></a></li>
                            <li><a href="/board.php?bo_table=m72"><img src="/img/new/snb_06.png"></a></li>
                    </ul>
            </div>

我一直试图在搜索网络上寻找解决方案。 我添加了代码，

.util li {display:inline;}

但是没用..

请告诉我，如何将它应用到 ie10-hack 并正确显示。

Answer 1

我建议添加 display: inline-block至 .util .如果这不能解决问题，您甚至可以包装 <ul>在<table>元素。一个很好的例子可以在 CSS 技巧链接上找到 - centering list items horiztonally