Is there a way to increase the size of just the bullet list-style-type using CSS? I don't want to increase the size of the bullet text, just the bullet type. I can't use images or JavaScript either. It has to be something I can embed inside <style>
tags within the <head>
tag.
It is possible to change the font size of your li> by wrapping it in a span or other tag, then to change the size of the bullet by resetting the content of your li>. When using em units, the size of the 'li' bullet can be adjusted proportionally. A list item bullet can be customized by using CSS.
The size of a bullet is defined by the browser, font, and font size. Although you can sometimes increase the size of the font to increase the bullet size, a better solution is to use an image as a bullet.
Might not work in old version of IE.
li:before{ content:'\00b7'; font-size:100px; }
Demo
For IE6:
Without javascript or images, I would recommend putting a <span>·</span>
in the beginning of every list item and styling that.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With