pionowo środek rozpiętość (etykieta ładowania początkowego) wraz z innymi elementami

Question

ja jak używać etykiety inline ramach ładujący CSS

<span class="label">Default</span> 

Niestety, te arkusze nie są pionowo wyśrodkowany przy stosowaniu razem z innymi elementami.

<p> 
    <span class="label"><a href="#">test</a></span>This is a test heading. 
</p> 

Proszę zobaczyć pełny kod dla wizualnego przykład: http://jsfiddle.net/kvPpm/

Jestem świadomy line-height i bezwzględnych/względnych obejścia pozycjonowania, ale nie był w stanie zastosować je poprawnie.

Jak wyśrodkować te etykiety w pionie?

Answer 1

Od <span> jest elementem inline domyślnie można po prostu zrobić:

span { vertical-align: middle|top|bottom; } 

i powinno działać. http://jsfiddle.net/kvPpm/1/

Ale wtedy <a> wewnątrz <span> nie jest semantycznie poprawne. Możesz po prostu użyć <a> i nadać mu styl display: inline.

http://jsfiddle.net/kvPpm/3/

Answer 2

.label { vertical-align: top; } 

Ten pracował dla mnie, gdy chciałem być prawidłowo ustawione w ul