Listas con CSS

Un poquito de CSS... y así de guapas quedan:

1

Typi tation gothica quis sollemnes eum. Consequat magna ex usus lectores lectorum. Lectores etiam eorum est diam assum. Commodo consequat legere volutpat dynamicus eleifend. Doming possim illum legere ad quis. Facilisi claram notare doming claritas consequat. Enim eleifend molestie possim nobis luptatum. Eum vero et delenit feugait accumsan. Hendrerit tincidunt vero vel eorum claritatem. Soluta legunt quod qui dolore typi.

2

Typi tation gothica quis sollemnes eum. Consequat magna ex usus lectores lectorum. Lectores etiam eorum est diam assum. Commodo consequat legere volutpat dynamicus eleifend. Doming possim illum legere ad quis. Facilisi claram notare doming claritas consequat. Enim eleifend molestie possim nobis luptatum. Eum vero et delenit feugait accumsan. Hendrerit tincidunt vero vel eorum claritatem. Soluta legunt quod qui dolore typi.

.- EL CSS:

h2.number {
position: relative;
top: 0px;
left: 0px;
font-size: 10em;
color: #ccc;
float: left;
margin-right: 10px
}



.comment-box {
margin: 0px 0px 50px 50px;
padding: 20px;
width: 240px;
border: 1px solid black;
float: left;
}

.- El HTML:

<div class="comment-box">

<h2 class="number">1</h2>

<p>Typi tation gothica quis sollemnes eum. Consequat magna ex usus lectores lectorum. Lectores etiam eorum est diam assum. Commodo consequat legere volutpat dynamicus eleifend. Doming possim illum legere ad quis. Facilisi claram notare doming claritas consequat. Enim eleifend molestie possim nobis luptatum. Eum vero et delenit feugait accumsan. Hendrerit tincidunt vero vel eorum claritatem. Soluta legunt quod qui dolore typi.</p>

</div>