JSFiddle - React, Tailwind, and code Playground
HTML
<ul>
<li>Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно </li>
<li>Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно </li>
<li>Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно </li>
<li>Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно </li>
<li>Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально адаптивно </li>
<li>Добрый день. Подскажите новичку как правильно оформить так маркеры списка? При этом чтобы это было максимально...
CSS
* {
margin: 0;
padding: 0;
list-style: none;
}
ul {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
li {
width: 50%;
padding-left: 50px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
min-width: 290px;
}
li:before {
content: '+';
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
position: absolute;
color: #ffffff;
left: 10px;
top: 5px;
background: #000;
font-size: 26px;
font-weight: bold;
font-family: Arial;
}