::after Появляется после текста в div а не после div — так и должно быть?
The ':before' and ':after' pseudo-elements can be used to insert generated content before or after an element's content. They are explained in the section on generated text.Спецификацияведь указано что он блочный элемент
То, что это блочный элемент, вовсе не значит, что он по каким-то причинам должен рендериться вне родителя. Это влияет только на его взаимотношение с соседними элементами.
А что касается вашего кода, у вас для after ширина дважды указана: 100% и 1400px. Не знаю, специально это или нет.
P.S. В будущем постарайтесь более подробно описывать, что именно странного вы видите в поведении элемента, я не сразу сообразил о чем вы говорите.
Афтер добавляется в конец элемента перед закрывающим тегом, бефоре - перед тегом.
Если хочешь добавить букву - поставь псевдоэлементам тип "инлайн".
Если хочешь добавить блок - поставь блочный.
Если это элемент вне блока - добавляй абсолют и двигай top: left:
Помни, что минус абсолютов в том, что когда ты будешь делать адаптивный сайт - они останутся абсолютами, что в адаптивном дизайне часто будет делать проблемы, если сделать неграмотно.