Как разделить сплошной блок на части на небольших экранах ⇐ CSS

[Anonymous]

Я ломал голову, пытаясь переместить «заголовок для удаления на маленьких экранах» после абзаца на маленьких экранах:

Код: Выделить всё

I consist of the main part

and the part that should go down on smaller sreens


I am the one who splits the heading on smaller screens

По сути, я пытаюсь получить что-то вроде этого:

Код: Выделить всё

I consist of the main part

I am the one who splits the heading on smaller screens

and the part that should go down on smaller sreens

Мне в голову не приходит ничего, кроме дублирования текста в макете и манипулирования им с помощью CSS, но это считается плохой практикой. Я должен решить эту проблему с помощью чистого CSS.
Буду очень признателен за помощь!
Я пробовал сделать контейнер сеткой/гибким, но в данном случае на большем уровне. на экранах мой заголовок не выглядит как сплошной текст (части имеют разрыв строки)

Подробнее здесь: https://stackoverflow.com/questions/792 ... er-screens