UL不显示内联

max*_*o87 1 html css haml sass

我正在尝试制作无序列表以进行内联显示.我有以下haml:

%ul.nav-dashboard
  %li.orders_nav{:class => is_active_menu?(user_orders_path(params[:user_id]))}
    = link_to side_nav_title('Order'), user_orders_path(params[:user_id])
  %li.bucks_nav
    = link_to side_nav_title('Points'), user_points_path(params[:user_id])
  %li.billing_records_nav
    = link_to side_nav_title()..
Run Code Online (Sandbox Code Playgroud)

这是sass:

.nav-dashboard
  +list-reset

  a
    display: inline-block
    padding: 10px 13px 10px 19px
    color: #808080
    line-height: 21px
    font-weight: bold
    border-bottom: 1px solid $border-default
    font-size: $font-base + 1
    &:hover
      color: $text-medium
  .active a
    background-color: #f2f2f2
    +box-shadow(inset 0 0 5px 1px #ebebeb)
    color: $text-medium
Run Code Online (Sandbox Code Playgroud)

出于某种原因,三个列表元素仍然在另一个上面显示一个,而不是彼此相邻.这可能是什么原因?

ski*_*405 6

难道ul你试图让内联?还是列出项目?

如果是后者 - 你需要设计li元素的样式,而不是a

.nav-dashboard li{
    display: inline-block;
}
Run Code Online (Sandbox Code Playgroud)