html - zurb foundation 6 导航栏(顶部栏)中的用户头像

Question

我在顶部栏中有一个用户的头像，但箭头在右边。左边怎么弄？我无法在任何地方找到那个 css。看图:

使用的代码在 ruby​​ on rails 中:

<li>
  <%= link_to image_tag(current_user.profile.avatar.url(:small), class: "img-circle tiny-img"), "#" %>
  <ul class="menu vertical">
    <li><%= link_to "Edit", edit_user_profile_path(current_user) %></li>
  </ul>
</li>

另外，如何改变箭头的颜色？

Answer 1

您需要为 .is-dropdown-submenu-parent.is-down-arrow>a:before 添加 css 规则并修改 .is- 的 css 规则dropdown-submenu-parent.is-down-arrow>a:after 像这样:

.is-dropdown-submenu-parent.is-down-arrow>a:before {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border: 5px inset;
  border-color: #2199e8 transparent transparent;
  border-top-style: solid;
  border-bottom-width: 0;
  position: relative;
  top: 0.25rem;
  float: left;
  right: 5px;
}

.is-dropdown-submenu-parent.is-down-arrow>a:after {
  display: none;
}

Fiddle Demo

更改 .is-dropdown-submenu-parent.is-down-arrow>a:before 的 top 值以更改箭头的垂直位置。