li element's (styled with CSS) marker has wrong position on chromium browsers, but good on fire-CodePudding

Code: (snippet here on Stack Overflow is shown good)

@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
}

.content-body {
  text-align: center;
  display: block;
}

.content-body-wrapper {
  text-align: center;
  display: inline-block;
  border-style: solid;
  border-color: #2B3AA7;
  border-width: 3px;
  border-radius: 30px;
  margin: 10px 10px 10px 10px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 15px;
}

.content-body p {
  max-width: 135ch;
  margin-top: 15px;
  margin-bottom: 5px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.content-body li {
  margin-top: 5px;
  margin-bottom: 5px;
}

<!DOCTYPE html>
<html lang="sk">
<head>
  <meta charset="UTF-8">
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div >
    <div >
      <ul>
        <li>Podporu viacerých operačný systémov (Windows, MacOS, Linux)</li>
        <li>Automatickú, manuálnu aktualizáciu z prostredia aplikácie</li>
        <li>Šifrovanie databázy (AES-128bit)</li>
        <li>Exportovanie do formátov PDF, BIN</li>
        <li>Importovanie/Exportovanie jednotlivých záznamov medzi touto aplikáciou
        </li>
        <li>Podporu viacerých jazykov</li>
        <li>Prispôsobivosť používateľského rozhrania</li>
        <li>Importovanie záznamov z aplikácie Matrika pre jednoduchšiu migráciu
        </li>
      </ul>
    </div>
  </div>
</body>

</html>

Chromium browser (Chrome, Opera) screenshot:

Firefox and Stack Overflow screenshot (for future use if SO renderer change):

I want to achieve look like in Firefox and SO for all browsers. I guess it is some implicit attribute for marker chromium is creating.

CodePudding user response：

Try this on the ul:

list-style: inside;