cannot custom bullets in list - html

Question

I am trying to custom my bullets for a list inside a specific < div > tag.
For that I created a class associated with the < div > tag, and in my CSS stylesheet I asked for the bullets that I want inside lists within that tag.
However, the bullets do not appear the way I want them to. The code seems to work, because I can add other cutomisations within the CSS style (make the text of the list bigger for instance), and it works.
I am using Spip for my website; maybe some of you won't be familiar with it: in my website's backoffice, I created a input area named TAKE_WITH_YOU and that's where the list is. Spip converts the list into a valid HTML list (ul and li), but I cannot access this code directly.
Here is my HTML code:
However, despite those changes, the bullets don't change from their default style.
The code seems to work okay, because as I said before, I can change the font-size by changing the CSS, and if I put none in the ul list-style-type, the bullets do dissapear. However, any other value (disc, square, an image, a hex code) brings me back to my original bullets...
.take_it ul {
list-style-type: "\25A1";
/*
I have also tried with:
list-style-image: url(puce-blanche.gif);
And with
list-style-type: "□";
*/
}
.take_it li::before {
content: "\25A1";
/*Also tried with other values as above*/
position: absolute;
left: 0;
}
<BOUCLE_150(MOTS){titre=« 150. take_with_you »}>
#SET{ident_div,#TEXTE*}
#SET{title_div,#DESCRIPTIF}
</BOUCLE_150>
[(#TAKE_WITH_YOU*|oui)
<div id="#GET{ident_div}" class=« take_it »>
<h3>[(#GET{title_div}|textebrut)]</h3>
[(#TAKE_WITH_YOU*|cs_decoupe_compat|propre)]
</div>
]
What am I doing wrong?
Thank you.

Answer 1

You can use list-style:none to customize the list-style. By looking at your code, I assume you are trying to use :before pseudo class to display the custom list style.
ul {
list-style: none;
position: relative;
padding: 0;
margin:0;
}
li {
margin-left: 20px;
}
li:before {
content: "\25A1";
position: absolute;
left: 0;
}
<ul>
<li>Take this</li>
<li>Take this one too</li>
<li>Take this one last time</li>
</ul>