1.И так имеется параграф, блочный елемент. в нем текст потом перенос и картинка с полем.
И нужно чтоб картинка и поле были на одной линии.
Я открыл инспектор чтоб показать границы параграфа и обвел картинку рамкой так как ее границы не видно. после должно быть напротив цыфр.

2.Отступаем 17рх сверху, блок раздувается и картинка уехала вместе с полем...

3.Пробуем подвинуть вверх поле, но оно стоит на месте, а блок еще больше раздувается..

Все должно было сработать, у меня есть видеоурок где ето работает, исходник готовый у меня не работает.
Что то за пару лет изменилось?

4. Решыл проблему так. margin-bottom:-16px; здесь кусок етой картинки можно пожертвовать, но вдруг будет другая? что тогда делать?
Скажите почему не работает/что не так или как лучше их выровнять..

дак а толку от выравнивания если мне надо на х пикселей сдвинуть? не посредине, не вверх, не вниз, не вправо, не влево, а именно пикселей на 17...

идея неплохая, нужно попробовать, но height ето не ширина а высота.
Ну я понял ход мысли, попробую

messer93, попробуй создать отдельный класс для картинки, укажи ширину или высоту бордер и другие свойства и в код картинки вставь этот класс, просто эти картинки будет всегда выводиться с одним размером.