Мобильная версия
Обычно для достижения этого не требуется никаких специальных знаний, но мне хотелось бы найти решение, которое также соответствует следующим критериям:
[*]Не используйте :before псевдоэлемент (это уже необходимо для достижения какой-то другой независимой цели),
[*]не используйте display:block/inline-block; для встроенного элемента (поскольку это создает некрасивые дыры в потоке текста),
[*]позволяют определять ширину элементов в процентах от содержащего их элемента (по крайней мере, после применения правила трех),< /li>
не жестко кодируйте верхнюю позицию/поле/отступы псевдоэлемент :after любым способом, который делает его зависимым от позиции родительского элемента внутри родительского элемента, высоты родительского элемента или фактической высоты элемента (или, короче: не делайте ничего зависимым содержимого),
[*]не вставляйте дополнительные элементы HTML и
[*]не добавляйте JS.
Я создал Codepen, который надеюсь, так будет легче понять, к чему я здесь клоню.
Я знаю, что легко можно добиться результата, нарушив одно из ограничений, перечисленных выше ( как показано в Codepen), но я ищу элегантное решение этой проблемы там, где это не требуется.
Поигравшись с этим уже довольно давно я бы сказал, что это невозможно, но это было бы здорово, если бы кто-нибудь смог убедить меня в обратном — или хотя бы формально доказать, что это на самом деле невозможно. Заранее большое спасибо за любую помощь.
Подробнее здесь: https://stackoverflow.com/questions/263 ... -inline-el
