css - 居中 <a> 元素

Question

我的 header 中有一个元素正在从 js 文件中获取数据。

我试图将该元素置于我的页面的中心，但我所做的一切似乎都有效。

我尝试了 margin-left: auto 和 margin-right: auto 但仍然没有居中。

元素代码为:

<a href="http://[ip]/tunein/tranceilfm.pls" id="cc_strinfo_song_tranceilfm" class="cc_streaminfo" style="margin: 0px; display: block; ">Loading...</a>

http://tranceil.fm

(菜单下方框中的蓝色歌曲信息)

有什么想法吗？

Answer 1

应该这样做(在父容器中使用 text-align: center 使链接居中):

<div style="margin: 0 auto; text-align: center">
    <a href="http://94.23.250.14:2199/tunein/tranceilfm.pls" 
    id="cc_strinfo_song_tranceilfm" class="cc_streaminfo" 
    style="margin: 0px; display:block;">Loading...</a>
</div>

或者简单地将 text-align: center 添加到元素本身:

    <a href="http://94.23.250.14:2199/tunein/tranceilfm.pls" 
    id="cc_strinfo_song_tranceilfm" class="cc_streaminfo" 
    style="margin: 0 auto; display:block; text-align: center">Loading...</a>

<!-- text-align: center directly on element -->
<a href="http://94.23.250.14:2199/tunein/tranceilfm.pls" id="cc_strinfo_song_tranceilfm" class="cc_streaminfo" style="margin: 0 auto; display:block; text-align: center">Loading...</a>

<!-- text-align: center on parent container -->
<div style="margin: 0 auto; text-align: center">
  <a href="http://94.23.250.14:2199/tunein/tranceilfm.pls" id="cc_strinfo_song_tranceilfm" class="cc_streaminfo" style="margin: 0px; display:block;">Loading...</a>
</div>

Fiddle