Tenho uma lista não ordenada que possui alguns itens de lista e gostaria de colocar uma linha horizontal (horizontal rule < hr >) nela, bem no meio, com altura de 2px. Eu tentei botar vertical-align: middle
mas a linha ficou em cima dos itens de lista. Eu gostaria de botar ela atrás deles, deve ter alguma propriedade do css que permita isso.
Os itens de lista podem aparecer ou não, dependendo de outros fatores. Ou seja, havendo ou não itens de lista, a linha horizontal deve sempre estar no meio da div.
Alguma dica?
Segue o código que tenho.
<ul>
<hr style="height:2px; border:none; color:#000; background-color:#000; margin-top: 0px; margin-bottom: 0px;">
<? if($primeiro_ponto != NULL && $ultimo_ponto != NULL && $quantidade_de_trajetos>0){foreach($conteudos as $ils){ echo $ils; }}?>
</ul>