Bullets em UL inline

.:Red Dragon:.

Power Member
Boas!

Eu tenho uma unordered list (<ul>) e pûs como "display:inline" no CSS. Ao fazer isto, os bullets desaparecem.

Como faço para meter um bullet ou algo parecido a separar cada item?
 
Uma opção é dar um padding à esquerda (excepto :first) e adicioanr a imagem de um bullet em background.

Código:
#menu li{
    display:inline;
    padding-left:15px;
    background:transparent url(images/menu-bullet.png) no-repeat scroll center left;
}

#menu li:first-child{
    padding-left:auto;
    background:none;
}
Não experimentei, mas acho que funciona (se tiveres a imagem no sitío certo).
 
Última edição:
Uma opção é dar um padding à esquerda (excepto :first) e adicioanr a imagem de um bullet em background.

Código:
#menu li{
    display:inline;
    padding-left:15px;
    background:transparent url(images/menu-bullet.png) no-repeat scroll center left;
}

#menu li:first{
    padding-left:auto;
    background:none;
}
Não experimentei, mas acho que funciona (se tiveres a imagem no sitío certo).

Não funcionou o #menu li:first... O bullet continua lá.
 
O display: inline tira as bullets automaticamente, o melhor que tens a fazer e' adiciona-las 'a mão (dentro de cada <li> por &bull; para simular a bullet), ou então poes um border 'a direita a separar cada item, tipo border-right: 1px solid black .
 
Back
Topo