将符号内的项目与ul中的项目对齐

Question

我试图将爱情心脏排在“A”之下而没有太多运气，我尝试过填充但它会影响适合的li。

<li class="dropdown-link link-menu-item">                                                                                                    
    <a href="/academic-diaries.htm">Academic Diaries</a>                                                                                                       
    <i class="fa fa-heart orange"></i>                                                                                                
</li>

.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

http://jsfiddle.net/xo9y31uk/ - 我无法模仿我所看到的。似乎是在jsfiddle

上做的

Answer 1

使用span将心脏包含在线条中。 Span是一种拥有单独元素但包含在另一个元素中的方法。

HTML

<li class="dropdown-link link-menu-item">    
    <span class="fa fa-heart orange"></span>   
    <a href="/academic-diaries.htm">Academic Diaries</a>
</li>

要获得演示，请点击here