How do I make a bulleted list?

Hello guys, how can I optimize my code? zoom out and make the li

we need it to work like this:
Безымянный

<span class="mn_upost mn_upost_f"><img src="/gs/gc.png" alt="Gros-Css"></span><div class="mn_upost mn_upost_fe"><a href="/"><b>Главная</b></a></div><div style="padding-top:2px"></div>
<span class="mn_upost mn_upost_f"><img src="/gs/gc.png" alt="Gros-Css"></span><div class="mn_upost mn_upost_fe"><a href="/forum/"><b>Форум</b></a></div><div style="padding-top:2px"></div>
<span class="mn_upost mn_upost_f"><img src="/gs/gc.png" alt="Gros-Css"></span><div class="mn_upost mn_upost_fe"><a href="/load/"><b>Файлы</b></a></div><div style="padding-top:2px"></div>
<span class="mn_upost mn_upost_f"><img src="/gs/gc.png" alt="Gros-Css"></span><div class="mn_upost mn_upost_fe"><a href="/publ/"><b>Статьи</b></a></div><div style="padding-top:2px"></div>
<span class="mn_upost mn_upost_f"><img src="/gs/gc.png" alt="Gros-Css"></span><div class="mn_upost mn_upost_fe"><a href="/photo/"><b>Галерея</b></a></div><div style="padding-top:2px"></div>
<span class="mn_upost mn_upost_f"><img src="/gs/gc.png" alt="Gros-Css"></span><div class="mn_upost mn_upost_fe"><a href="/board/"><b>Видео</b></a></div><div style="padding-top:2px"></div>
<span class="mn_upost mn_upost_f"><img src="/gs/gc.png" alt="Gros-Css"></span><div class="mn_upost mn_upost_fe"><a href="/dir/"><b>Топ сайтов</b></a></div><div style="padding-top:2px"></div>
<span class="mn_upost mn_upost_f"><img src="/gs/gc.png" alt="Gros-Css"></span><div class="mn_upost mn_upost_fe"><a href="/stuff/"><b>Мониторинг</b></a></div><div style="padding-top:2px"></div>
<span class="mn_upost mn_upost_f"><img src="/gs/gc.png" alt="Gros-Css"></span><div class="mn_upost mn_upost_fe"><a href="/gb/"><b>Гостевая</b></a></div><div style="padding-top:2px"></div>

Css code:
.mn_upost{padding:1px;border:1px solid #101010;background:url("/gros-css/menuo.png");text-align:center;padding-top: 2px;padding-bottom: unset}
.mn_upost:hover{background:url("/gros-css/menuh.png") repeat-x scroll center center transparent}
.mn_upost a:link{text-decoration:none;color:#8e8e8e}
.mn_upost a:visited{text-decoration:none;color:#8e8e8e}
.mn_upost a:hover{text-decoration:none;color:#fff}
.mn_upost a:active{text-decoration:none;color:#8e8e8e}
.mn_upost_f{float:left}
.mn_upost_fe{text-align:left;margin-left:23px;padding:4px 5px 5px}
1 Like

Very simple, if you want the list to be bulleted (aka have a dot before the word) then this is what I found online for your problem.

First, place the (ul) (/ul) tags around the text to turn into a bulleted list .

Second, place the (li) (/li) tags around each line item in the list.

I just recommend you re-read what it said it in the course, I did the course a while ago so my memory is a bit hazy on it, but I know it teaches you how to use lists.