hi!
Is it possible to have bigger bullets in the ul? (right now, they appear quite small on the PDF).
Thanks

Many options here. Depending on the font used, you can change the char itself by using

li::marker {
  content: "/* here */";
}

or change the font-size

li::marker {
  font-size: 1.2em;
}

or use border-radius to fake a bullet.

thanks!
I used:

ul li::marker {
font-size: 2em;
}

and it worked perfect. However, is there a way to decrease the vertical position of the bullet in this case? (please see the screenshot enclosed)

1. bullets.png‎ 35.5 kB

of course. just use either vertical-align, margin-top or a combination of position: relative and top to adjust the vertical position.

Thanks. I am trying with a super simple CSS but don't manage to change the vertical alignment (the bullet is always at the same position). This is the style am using for tests:

li::marker {
        font-size: 2em;
	margin-top: 1000px;
    }

I also tried with

li::marker {
      	font-size: 2em;
	vertical-align: bottom;
    }

but no luck either. Any tip?
Thanks again

I think padding-top may work better.

hi Michael,

I tried with padding-top but didn't work either

Odd, I will see if I can find a way to do it. In the meantime, a quick workaround might be to use a different character, such as U+25CF "black circle", which is bigger than the standard bullet:

li::marker {
    content: '\25CF'
}

thanks Mike, I will use this trick (please let me know anyway if you find the solution to the margin/padding/vertical-align).

I think it may not be possible to change the vertical alignment, as Prince forces the baseline of the marker to match the baseline of the list item, regardless of surrounding decoration like padding or borders. Perhaps we need to respect the vertical-align property on the ::marker pseudo-element.

I'm sorry for making wrong suggestions. I'm normally using li::before instead of li::marker, and expected the later to behave the same way. In this case, you might want to use css3 transforms. However using li::before may allow the use of vertical-align, but also requires some extra styling to behave like a normal list bullet. See the attached files for examples.

1. test.html‎ 2.9 kB
2. test.pdf‎ 22.5 kB

thanks! I will try it

I faced the same issue. If you change the font size of the bullet then you will have to deal with alignment issue. I tried a different font solved the issue. some fonts have bullet size bigger than other fonts