[HTML][CSS]Koło i napis w środku Opcje

[senior.pol]

Witam,

Chcę, zrobić koło, a w nim tekst np. "1".

Krótki zapis kodu:

[HTML] pobierz, plaintext 
<ul class="xxx">
        <li><i class="nr">1</i> Jakiś tam tekst.</li>
</ul>
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
.xxx li i.nr {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	text-align: center;
}
[CSS] pobierz, plaintext 

Próbowałej już kombinować, ale na razie bez efektów. Proszę o pomoc w rozwiązaniu problemu.

Ten post edytował senior.pol 15.01.2014, 22:28:41

[Kshyhoo]

Nie wiem, o co Ci chodzi dokładnie, lukaj.

[HTML] pobierz, plaintext 
<ul class="xxx">
  <li><i class="circle">1</i> Jakiś tam tekst.</li>
  <li><i class="circle">2</i> Jakiś tam tekst.</li>
  <li><i class="circle">3</i> Jakiś tam tekst.</li>
</ul>
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
.xxx {
  list-style-type: none;
}
.circle {
  background: #fc2e5a;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  border-radius: 50px;
  padding: 10px 15px;
  line-height: 40px;
}
[CSS] pobierz, plaintext 

Wkleję tez tu, bo mi coś jsfiddle mnie nie lubi (IMG:style_emoticons/default/smile.gif)

Powód edycji: [Kshyhoo]: