it4life - Portal de Informática

decoder


1.0 user
17 posts

Boas,

Estou a tentar fazer círculos usando apenas CSS, mas não estou a obter o resultado esperado. O elemento que estou a usar é o <span> e o código CSS é:

span.circle{
	width:6px;
	height:3px;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	background-color:#333;
	cursor:pointer;
}

span.circle:hover{
	background-color:#222;	
}

 

Se alguém puder dar uma ajuda, agradecia.


soniaR


1.0 user
1 post

Boas,

A única coisa que te falta é adicionar o display:block, já que os <span> são elementos do nível inline.
Além disso, para fazeres um círculo perfeito, a altura tem de ser igual à altura (não sei se foi gralha, mas tens 6px para a largura e 3px para a altura).

Resumindo, o código completo passa a ser o seguinte:

span.circle{
    width:6px;
    height:6px;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    background-color:#333;
    cursor:pointer;
	display:block;
}
span.circle:hover{
    background-color:#222;
}

 


decoder


1.0 user
17 posts

Funciona na perfeição! Obrigado pela dica.


Segue-nos nas redes sociais