Question

正如你在jsfiddle中看到的那样，我的工具提示框正在工作，但令人讨厌的是它们不在中心。由于缺乏更好的词汇，这些盒子似乎“几乎居中”。即使我将它作为css代码的中心对齐。

谢谢。

<ul class="horizontal-list">
                <li><a href="Google.com"><img src="images.png" onmousedown="return false;" alt="aaaaaa" /><span id="tooltipmain">aaaaaa</span></a></li>
                <li><a href="Google.com"><img src="images.png" onmousedown="return false;" alt="aaaaaa" /><span>aaaaaa</span></a></li>
                <li><a href="#"><img src="images.png" onmousedown="return false;" alt="aaaaaa" /><span>aaaaaa</span></a></li>
                <li><a href="#"><img src="images.png" onmousedown="return false;" alt="aaaaaa" /><span>aaaaaa</span></a></li>
                <li><a href="#"><img src="images.png" onmousedown="return false;" alt="aaaaaa" /><span>aaaaaa</span></a></li>

.header-1

http://jsfiddle.net/ud2pajtb/7/ 抱歉拼写错误。

Answer 1

由于您的<span>绝对定位，因此设置margin:0 auto不会使其相对于父元素居中。现在它的对齐基本上是基于它的宽度，所以为了使工具提示看起来居中，稍微增加它的宽度。

http://jsfiddle.net/xw3z1890/
在这里，我只需将<span>宽度设置为109px。

将工具提示居中到内联列表框

1 个答案: