html - 多于一行时对齐行

Question

我在子导航上有一个元素列表，如下所示...

每个代码的html如下

<label for="DOG - BARK CONTROL TRAINING &amp; BEHAVIOURAL_searchSubCategories" class="facet_block-label"><span>DOG - BARK CONTROL TRAINING &amp; BEHAVIOURAL (2)</span>                         </label>

css如下

label {
    color: #FFFFFF;
    font: 12px Arial,Helvetica,sans-serif;
    text-transform: lowercase;
}

label span {
    float: none;
    position: inherit;
    width: auto;
}

问题是当线条变长而不是正确对齐时，它并没有这样做。例如，我希望行为 (2) 这个词与狗很好地对齐。知道如何使用 css 轻松做到这一点吗？

Answer 1

解决方法是将标签的display改为inline-block看这个fiddle .