Как задать отступ для элементов списка рядом с float изображением?

Question

[sadCake]

Доброго времени суток. Есть страница у которой есть какая-то главная фотография и ее обтекает какой-то текст. Задал float: left для картинки, все вроде было ок, но если рядом с картинкой список, то там неправильно отображаются отступы, не могу понять, что именно не так, на примере все видно

JS Fiddle: https://jsfiddle.net/zy8cjL7w/5

Answer 1

[Sagrana]

Это естественное поведение при float. Весь текст обтекает картинку, а список — это тоже текст. Для того, чтобы изменит это, вы можете задать ul display: flex;

Comments

[sadCake]

И тогда текст становится не обтекаемый... Мне необходимо сохранить у списка, который около картинки, отступ и обтекание текста.

[Sagrana]

sadCake, хм, тогда я просто не очень понимаю, что вы всё-таки хотите получить, ведь сейчас как раз и происходит обтекание списком картинки?



Нарисуйте, что ли, схему предполагаемого расположения блоков.

[sadCake]

Sagrana, joxi. ru/Vm6ybWLc4n0xer
Хабр заблокировал ссылку, хотел еще в прошлый раз скинуть

[Sagrana]

sadCake, ага, так понятнее)
Для того, чтобы убрать внешний отступ, нужно для ul задать padding: 0; а вот расстояние между маркером и текстом в строке нельзя настраивать. Но можно убрать стандартный маркер для списка, и добавить свой через псевдоэлемент у li, его можно будет настроить, как душе угодно.