How to style pseudo counter in CSS

Question

How do I change the font size of the counter in this example:

<style>
p
{
counter-increment: myIndex;
}

p:before
{
content:counter(myIndex);
}
</style>

Webpage content

<p>First make a variable (myIndex) and make it increase every time a p element occurs.</p>
<p>Then insert the counter in front of all p elements</p>
<p><b>Note:</b> For the counter property to work in IE8, a DOCTYPE must be declared.</p>

http://www.w3schools.com/cssref/tryit.asp?filename=trycss_content_counter

Answer 1

Simply set the font-size for the :before psuedo.

Demo Fiddle

p {
    counter-increment: myIndex;
}
p:before {
    content:counter(myIndex);
    font-size:30px;
}