如何在zurb foundation的Side nav中将“：before”元素用作图标？

Question

我在基础的侧面导航中添加了一个子菜单，与this示例完全相同，但图标位于文本上方。

我的CSS：

demo = idLookup.Select(g => g.First()).ToList();

我的HTML：

func (c App) New() revel.Result {
    var event models.Event
    event.Start_Year = time.Now().Year()
    c.RenderArgs["event"] = event
    return c.RenderTemplate("app/edit.html")
}

jQuery的：

.hasChildren:before{
    content: "\25ba";
    float: left
}
.hasChildren.active:before{
    content: "\25bc";
}

Image describing my problem

My problem on jsFiddle

Answer 1

使用相对定位，如下所示：

.hasChildren:before{
    content: "\25ba";
    float: left;
    position: relative;
    top: 6px;
}
.hasChildren.active:before{
    content: "\25bc";
}

更新了小提琴：

http://jsfiddle.net/vpoycbzb/1/