Bulleted lists are a bit of a writing obsession for me. In a past life I was an actual technical writer with an editor fixing all of my mistakes and teaching me how to write. Alison beat in my head “Groups of things should all be bulleted lists”. Things I write tend to be groups of stuff and end up in bulleted list, so we need pretty bullets. HappyMillFam.com runs on WordPress using the Customizr theme the look and feel
The theme out of the box created bulleted list like the ones to the right in the below image.
The list to the right is not pretty in my eyes. It needs more space to breath and be readable. I want bulleted lists like the ones to the left where there’s spacing to breath after each bullet. Sadly, the Customizr theme does not provide the ability to do this natively. Web things are all code and can be changed. I needed to add some custom CSS to the theme to make it make me happy. Being awesome, Customizr provides a simple bucket to add custom CSS too. All I needed was the CSS.
Finding the right CSS took me longer than 20 minutes. KevRule 19 |
if it takes longer than 20 minutes to solve something and it’s not NDA, publish the answer.
Question | how do I add space after bullets using CSS.
Answer | add the line below.
li {margin-top:7px;}
There is a simple bucket in the Customizr theme to add code. I opened the bucket, added the code, and YEAH spacing. To add to your WordPress theme you’ll need to find the correct CSS style sheet and edit it.