Как убрать промежуток у inline-block?

Question

[Темур Бегиев]

Есть три li. Им указанно display: inline-block и margin-right: 19px.

При этом еще добавляется 3px (синий кружочек). Как убрать?

Answer 1

[Олег]

ul {font-size:0;}
ul li {font-size: 1rem;}

Comments

[Темур Бегиев]

Только пропадает часть текста. Для них нужно будет размер прописывать.

[Олег]

Темур Бегиев: Да, для потомков придется указывать размер шрифта. Можно еще убрать все пробелы между html тегами, но первый вариант лучше.

[Темур Бегиев]

Олег: благодарю!

[Темур Бегиев]

Олег: хорошо сделан личный сайт. Исходника случайно нет?)

[Олег]

Темур Бегиев: Нет, я на коленке делал, поэтому код непрезентабельный, на основе expressjs.

Answer 2

[Удаленный Аккаунт]

margin-left: -3px; Не подходит?
или в HTML разметке разместите элементы li в один ряд.
Ваши дополнительные три пикселя скорее всего появляются из за того что браузер добавляет невидимые символы перевода строки.

Comments

[Темур Бегиев]

Пробовал margin-left. Тогда список выходит за рамки родителя. Вариант выше подходит.

Answer 3

[Александр Борисович]

ul {font-size:0;}

костыль, говорят на андройде глючащий.

Проще при верстке, если это php, вставлять теги

</li><? 
?><li>

Парсер скушает эти теги и не оставит пробела, из за которого это и получается.

Или самому не делать пробелов между тегами то есть все в линию все теги

Answer 4

[Денис Т]

css-live.ru/articles/zagadochnye-otstupy-mezhdu-in...
здесь ты найдешь ответ.
я просто пишу лишки пордряд: