Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community!

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial


How to insert square before paragraph

I have some paragraphs , and I would like to insert filled black square (just like from list-style: square;) using p:before

Is it possible? I couldnt find square entity or hex code anywhere online.

Thanks in advance

1 Answer

Hi Milan,

The best glyph I found was a small middle dot, written into the CSS like this -

p::before {
    content: "\00b7";
    margin-right: 5px;

But what about just adding a div before the paragraph, and styling it how you like? Like this -

<div></div><p>This is a length of paragraph.</p>
div {
    width: 5px;
    height: 5px;
    background: #333;
    float: left;
    margin: 6px 6px 0 0;

All the best,


Thanks Ede!

I've also found that one for circle, was just hoping there is maybe some hex value for square, to avoid adding that div.

But thanks a lot!


Hi Milan,

No problem!

All the best,